css - Div margin-bottom of a proportion of its own height? -


for example, have div has height of 100px (i don't know height, let's suppose did). want set margin-bottom percent, 25% 25px assuming previous height. however, percent seems of document, not element:

<div style="height:100px;margin-bottom:100%"></div> 

the margin should 100px isn't, 100% of height of page.

the element line of text has no background, using height:150% theoretically work.

as others note, don't know can use css this. jquery help:

http://jsfiddle.net/userdude/pzavm/

<div id="margin">foo</div>  div#margin {     background-color:red;     height:100px; }  $(document).ready(function(){     alert($('#margin').height());     var margin = $('#margin').height()/4;     $('#margin').css('margin-bottom',margin);     alert($('#margin').css('margin-bottom')); }); 

edit - possibly done using em's.

edit 2 - em's keying off font size, not calculated box model size. won't work.

edit 3 - jcoc611 able use em approach after all.

original: http://jsfiddle.net/userdude/xn9v7/3/

jcoc611's demo: http://jsfiddle.net/bctg2/

the code:

<div id="foo">     foo </div> lol  div#foo {     background-color: #fcc;     margin-bottom: 1.5em;     font-size:20px } 

Comments

Popular posts from this blog

javascript - Enclosure Memory Copies -

php - Replacing tags in braces, even nested tags, with regex -