How do I work out 100% of min-height in CSS into pixels?

Question

What I want to do is to set min-height: 100%; in one section tag, and then use the same size in other section tags. So I would need to get the pixel size of that 100%. An example is here. (scroll down when you're there). Thanks!

Accepted Answer

0

Why not add CSS rules for all section tags (Use CSS selectors to select different classes of section tags)? For example:

< style >

    section.mySpecifiedClass {
      min-height: 100%;
    }

< /style >

If you need the height in pixels to send it to the server-side for some computations and math (For example: loading a mini-scaled image to be put inside the section tag in order to save bandwidth and improve performance). Using jQuery.height() would give you what you want:

< script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">< /script >

< script >

  var theWidth = $('section.mySpecifiedClass').height();

  alert(theWidth); //Should alert the height value

< /script >

answered Jul 28 '12 at 21:59

TjWallas
271●3●6●9

edited Jul 29 '12 at 10:48

Thanks I'll work on that later.

(Jul 29 '12 at 05:30) RafalChmiel

However how can I pass the "theWidth" variable to CSS?

(Jul 29 '12 at 05:30) RafalChmiel

It only comes up with "null".

(Jul 29 '12 at 05:34) RafalChmiel

Well, you can use the same jQuery function to set the height of other section tags on the fly. For example:

<script>
  var theWidth = $('section.mySpecifiedClass').height();
  $('section.myOtherSpecifiedClass').height(theWidth);
</script>

You can also take a look on jQuery.css() for other advanced css modifications on the fly.

(Jul 29 '12 at 09:58) TjWallas

I created a Working example for you. Check it out: http://jsfiddle.net/ccHYx/

(Jul 29 '12 at 10:49) TjWallas

How do I work out 100% of min-height in CSS into pixels?

Follow this question

Related questions

Lockergnome.net

Lockergnome