I have a page with a bunch of divs that stretch vertically depending on the content. The problem is that there are background images that need to align just right. I know I can specify a fixed height, but that's not what I want. I need to to expand as needed by the content, bun increments of 10px.
So if the content stretched the div out to 505px height - it would actually extend to 510px or whatever the next 10px increment was... make sense?
As far as I know this isn't possible with CSS, but I'm hoping someone can prove me wrong.
Thx!
3 answers
points
Hmm, how about do a paragraph with a line-height of 5 and then add a linebreak (with jQuery or such) each time you need them to increment?
points
If the content in the div is purely textual, then you should be able to achieve this with a simple
line-height: 10px;
Of course it may not hold up under all circumstances. The most foolproof way would be to write a bit of javascript that checks the height of your div. The pseudocode should look something like this
get div-height
if div-height is a multiple of 10
do nothing
else
set div-height to the next greater multiple of 10
points
I think you are looking for something like following [min-height] .yourDiv { min-height:500px; height:auto !important; height:500px; }
And if you want dynamically increase the div with height of the content + 10px, then it would be easily achievable by jquery. let's give a try.
