homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

use overflow and have a default height

 6:02 am on Feb 27, 2009 (gmt 0)

I would like to know is it possible to use overflow and have a default height. I want the div to be at least 400px but if the content needs more space then it can just morph without messing up all the other content in the other elements.



 11:03 am on Feb 27, 2009 (gmt 0)

Depending on your definition of "morph" that's exactly what overflow is for.


Why don't you give it a try in a few small examples ?


 6:09 am on Feb 27, 2009 (gmt 0)

System: The following message was spliced on to this thread from: http://www.webmasterworld.com/css/3858916.htm [webmasterworld.com] by swa66 - 11:13 am on Feb. 27, 2009 (utc 0)

I am using css overflow auto but it keep on scrolling my content and i just want it to expand my element without really messing up the other div elements.


 11:24 am on Feb 27, 2009 (gmt 0)

I've merged these two topics as I think it clarifies what you're trying to achieve.

In standards compliant browsers (read: forget about IE6 for now) setting a height means fixing it.
If you then add more than can fit in it overflow will dictate how it all will react to "I've 5 moneys and only room for 3". Either the 2 extra monkey can swap cages with the other 3 as needed (scroll), either we release 2 of them in the wild and they occupy the neighbor's garden (visible), either we hide them out of view (hidden).

If you don't want the box to be fixed in size, well then don't set the height.
If you want the box to have a minimal size, set the min-height (to e.g. show 3 cages even if we currently only have one monkey, so we show 2 empty cages).
Similarly max-height can be use to set a maximum.

So what about IE6: it's broken, nothing new there. IE6 doesn't do min-height nor max-height. Easiest is to use a conditional comment and see how it reacts if you use height to mean min-height, (that how it often reacts as even with a set height it will still expand boxes). If it doesn't do it like that (it sometimes doesn't) you have two options: either use proprietary expression to set the height using them as you need (this is basically something like javascript inside CSS, and rather inefficient), or I usually will send IE6 back to school and apply IE7.js [code.google.com] on it to teach it using javascript the meaning of min-height and max-height

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved