Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Set min-height property with pure Javascript

Tags:

javascript

css

I am trying to set an inline style property of a div using javascript. This seems to work to get the value to an alert window:

<!-- /returns 890px for me -->
<script>
  alert(screen.height - 10 +"px");
</script>

However, this does not set the style for the div with the ID used:

<script>
document.getElementById("page-wrapper").style.min-height = screen.height - 10 +"px";
</script>

Neither does this:

<script>
    document.getElementById("page-wrapper").style.min-height = screen.height - 10 +"px";
</script>

Any help would be appreciated.

like image 263
emailcooke Avatar asked Mar 19 '15 20:03

emailcooke


2 Answers

Use camelCasing for CSS styles in JS

<script>
    document.getElementById("page-wrapper").style.minHeight = screen.height - 10  +"px";
</script>
like image 193
Rorschach120 Avatar answered Sep 27 '22 21:09

Rorschach120


You're close. The property is camel-cased without a hyphen, like:

<script>
    document.getElementById("page-wrapper").style.minHeight = screen.height - 10 + "px"
</script>
like image 39
Michael B. Avatar answered Sep 27 '22 22:09

Michael B.