I looked around for a solution on the site but I couldn't find exactly what I was looking for so...

On my website I have a Table with 2 columns, each column has a DIV in it. How can I make it so that each of the DIVs take up the entire space in the Table TD? I can post an example or link to the site itself...if thats allowed.

Recommended Answers

All 6 Replies

Member Avatar for soldierflup

Why using DIV's in a table ?

You can get the same result by floating the two divs with CSS.

html :

<html>
<head>
<style>
#divone {
width: 50%;
float: left;
}
#divtwo {
width: 50%;
float: left;
}
</style>
</head>
<body>
<div id='divone'>bla bla bla</div>
<div id='divtwo'>bla bla bla</div>
</body>
</div>

If you persist in keeping the divs in a table column I don't see the problem because the row of the table will automatically expand to the content of the largest div.

An example of your code would the interesting to see what you want to achieve.

Umm, you can take a look at the site: http://www.uzunaru.com

If I float the DIVs does that mean they will appear side by side? Sorry, I'm not really very good at doing more fancy web templates/layouts. Usually I just do plain sites but wanted to try something different.

Member Avatar for soldierflup

If you float the divs the will appear side by side. I've been looking at your code and I suppose you want to make appear the right div at the top of the column in your table. Change your code from the right column of your table to :

<td width="251px" valign="top">

This will put the div inside your column at the top of the column.

If you float the divs the will appear side by side. I've been looking at your code and I suppose you want to make appear the right div at the top of the column in your table. Change your code from the right column of your table to :

<td width="251px" valign="top">

This will put the div inside your column at the top of the column.

Hmm ok, that solves one problem. Now the problem of the Nav column not expanding to the whole available area in the right column is the second. If I have to I will check out this "float". Quick Q~ about floating DIVs do that need a containing DIV?

Member Avatar for soldierflup

The div's don't need a containing div because they are already in a containing div (container).
To make sure that the next div (footer) will appear correctly is adding the next statement under the second floated div : <br style="clear: both;" />

If you want to, I'll send you a redesigned example of your page.

The div's don't need a containing div because they are already in a containing div (container).
To make sure that the next div (footer) will appear correctly is adding the next statement under the second floated div : <br style="clear: both;" />

If you want to, I'll send you a redesigned example of your page.

Sure you can do that if you want to. It would greatly help me.

Also my footer is outside my container because for some reason it was getting blended into the News/Navigation DIVs.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.