PDA

View Full Version : expanding div tag


dazzclub
05-21-2007, 08:08 PM
hi there,

using css

can we create a box, fill it with some content and if the content increases, the box will accomidate for this.

im making a site at the mo, and ive given my div tags set height and width. But in future i`ll know i`ll be getting more content to put in and rather than having to go back in the css and make the changes. Is there a css code that can be declared now and will adjust to the content that its containing.So no matter what the content ( text ) will always be in the box.

cheers

davidj
05-22-2007, 08:15 AM
add the <div id="clear"> below inside your main box below the content div


<div id="container">

<div id="content">text text text text text text text text </div>

<div id="clear">&nbsp;</div>

</div>


CSS Style for the clear div...


#clear{

clear:both;
padding:10px;

}


this did my head in last week.

domedia
05-22-2007, 01:58 PM
No need for extra tags. Just omit the height property in CSS and it will adjust automatically. This is default behavior for block elements so you have this already.

davidj
05-22-2007, 02:15 PM
didnt do that for me

i had to hack it

and you need an initial height for a block or your block collapses to a thin line

domedia
05-22-2007, 02:49 PM
Then you have something extra that gives you that dj. Some floating elements inside maybe?

All table and block elements will automatically stretch by default.

If you have floated elements inside the parent div, then just add these 2 lines of CSS to your parent div:

height: 1%;
overflow: hidden;