Jump to content

dynamic div width


westman

Recommended Posts

I there

I am trying to get 2 divs side by side filling the page.

the div on the left can change width depending on content.

how do i set the width of the right div? since the left div has no set width

 

I have looked at this...

http://kamlekar.wordpress.com/2013/06/28/set-dynamic-like-heightwidth-using-just-css/

but it is not dynamic for what i need

Link to comment
Share on other sites

Divs will automatically adjust when you don't define a width and or a height. Therefore, if you define a width and a height, that's as big as it will get.

Edited by niche
Link to comment
Share on other sites

Actually, to make 2 columns side by side, give the first div (column) a width and float to the left. The second div (column) just needs a left margin that is equal to or greater than the width of the first column. That would make this right column expand to take up the room leftover.

 

<body>

<div id="wrapper">

<div id='leftcol"></div>

<div id="rightcol"></div>

</div>

</body>

 

#leftcol {

width: 240px;

float: left;

}

 

#rightcol {

margin-left: 240px;

}

 

Keep in mind, the source order of the divs is important when you float only one of them. The floated column (div) needs a width and it needs to be inserted before the non-floated column.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...