have 2 divs extend together?

[Northern Flame]

How can i have 2 divs extend together?

lets say i have these 2 divs in the center of my

page:

 

<div id="left">
<h2>Left Side</h2>
<p>This is the left side of the layout.</p>
</div>
<div id="content">
<h2>Main Content</h2>
<p>This is where the main content goes....</p>
<h2>Another Paragraph</h2>
<p>This is another paragraph....</p>
<h2>Etc.</h2>
<p>.....</p>
</div>

 

 

all the content for both the left and center is different on each

page so i dont know how long it can be. i want them to both

have the same height. i've had them both extend together with

tables like this:

 

<table>
<tr>
	<td>
		<h2>Left Side</h2>
		<p>This is the left side of the layout.</p>
	</td>
	<td>
		<h2>Main Content</h2>
		<p>This is where the main content goes....</p>
		<h2>Another Paragraph</h2>
		<p>This is another paragraph....</p>
		<h2>Etc.</h2>
		<p>.....</p>
	</td>
</tr>
</table>

 

and that works fine, but i want to do this with divs. does anyone know

how i can do this with divs and css?

 

P.S. the divs each have borders so it will be obvious to the user if they do not

have the same height.

[TheFilmGod]

You can set an equal height for both divs.

 

If the height will be dynamic - then there isn't a way around it. This is one of the disadvantages of using pure css. Tables are actually a solution.

[Northern Flame]

oh alright,

thanks for the info

[TheFilmGod]

 

Tables are actually a solution.

 

What? I can't believe my eyes "CSS Guru Wanna Be The FilmGod"; you suggesting tables.

 

ha ha!  There are always certain advantages to using tables. And this is one of them.

[phpQVersion25.0]

 

ok - I will buy that one for now.

[bronzemonkey]

This can be done with css. Tables are for tabular data and not for layouts.

 

1. Google "Faux Columns" - there is an article on A List Apart about it.

2. Google "Perfect 3 Column Liquid Layout" - can be used as a basis for fixed or liquid layouts with apparently equal height columns.

 

[Northern Flame]

wow thanks!

that article on Faux Columns really helped!

[haku]

Faux columns is the best way to go. It works quite well, and doesn't require tables!

[TheNuQ]

 

Nothing wrong with good ole html tables for layout too; but both agree on that Northern Flame. Which ever one works best for you though - remember; personal preference - lol - good luck

[haku]

Sure there is. Its a semantic mis-use of tables. Tables are supposed to hold tabular data, this data isn't tabular.

 

Not that it wont work. But I could wash myself with bleach everyday and become clean, that doesn't mean its the right way to use bleach.

[haku]

So does washing myself with bleach. What's your point?

[Northern Flame]

lol

this argument again!

 

how about we keep it at a personal preference

and thats it!

 

if someone wants to wash themselves down in

bleach, let them....

[haku]

Insofar as its a personal choice to make in doing it the right or wrong way its a personal preference.