CSS & Firefox

[kconmle]

I am having an issue where I have a table in a div... When the table grows longer than the div the div does not expand in FF... works fine in IE - what do I need to do to have the div expand with the table?

 

[ca8msm]

At a guess, I'd say make sure you haven't set a defined height on the div.

If you can provide a link to your page we can verify what the actual cause is.

Mark,

Darlington Web Design
Experts, Information, Ideas & Knowledge
ASP.NET Tips & Tricks

 

[kconmle]

Here is what the code looks like:

<div id="container">
<div class="content">
<table>... has no css</table>
</div>
</div>


#container {
margin-left:auto;
margin-right:auto;
width:95%;
height:75%;
opacity:.75;
filter:alpha(opacity=75);
border:1px solid #ffffff;
}

.content {
position:relative;
float:left;
height:100%;
width:75%;
}

 

[ca8msm]

You have a 75% height on the container, so I'd assume that it restricting the visible height you can see of the table. If you always want to expand the height to show 100% of the table, then why specify a height for it's container?

Mark,

Darlington Web Design
Experts, Information, Ideas & Knowledge
ASP.NET Tips & Tricks

 

[kconmle]

That is meant to give it a minimum height... when I take the height out - then it has not height - which I think goes back to the same problem... I want the stuff in the container div to give it its height...

 

[ChrisHunt]

It's because the inner div is floated - doing that takes the div out of the document flow, so the outer div doesn't (by default) expand to contain it.

Try adding [tt]overflow:auto[/tt] to div#container (or remove the float from div.content, since it doesn't appear to do anything useful).

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[kconmle]

taking out the float in content had no affect (as you said...) putting overflow:auto did nothing in FF and in IE it kept the height at 75% and put in scrollbars (before it was expanding the div to fit...)

 

[ca8msm]

That is meant to give it a minimum height

Then you should use min-height, not height.

Mark,

Darlington Web Design
Experts, Information, Ideas & Knowledge
ASP.NET Tips & Tricks

 

[kconmle]

right - I know, but once I can get them properly nested - I should not need either....

 

[kconmle]

I found a solution - my code was fine (still did not need the float:left) but my doctype declaration was wrong... I corrected that to transitional and it is fine in both...

 

[Vragabond]

If what you showed us is your entire code, then there's actually no need for the .content div at all. It seems that you have changed from a valid doctype to an invalid one, because rendering usually does not change between two different valid doctypes.

[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]