-
Hi,
Can't seem to get to the bottom of this -
I have a div which is floated, the contents are floated inside, and after all the contents I have the usual kind of float clearing div. I've done this a thousand times and with static sites the div always stretches to accomodate the content, as you'd expect.
This time though I am drawing the content in from a mssql database to populate the div with (it's a content management system I'm writing) and the weird thing is, the div never stretches to fit the content, the content just runs through the bottom of the div. This is the weird bit though, if I then press refresh, the div does stretch.
So in other words, the first time of viewing the div doesn't stretch, but if refresh is hit, the div does refresh. Edit - sorry meant to say the div does STRETCH.
Why could this be? Is it something to do with rendering the div before the content is drawn in or something? It's making me pull my hair out now..... even tried a table cell instead of a div and the same thing happened......
Thanks.
-
-
Aaaah sorry no, it's an internal company site...... :dead:
-
After the last bit of floated content inside the main div, put the following:
<div style="clear: both"> </div>
-
I'm already doing that - in my style sheet I have :
.floatClear
{
clear:both;
font-size:0pt;
width:100%;
}
then obviously doing a
<div class="floatClear"></div>
after the content.
Thanks for the suggestion anyway.....
The funny thing about this is SOMETIMES it works and sometimes it doesn't. I'm still stuck on the idea that because it's pulling stuff from a database, somehow it's rendering the div before the content is pulled from the database, if it's pulled in time it stretches the div, and if it isn't, it doesn't. Is this a possibility? If it is then what are some workarounds?
-
Try using <table> instead of <div> and see what happens.
Tables will render after they're loaded.
-
Hmmm... thanks for that msleim, but still no joy! Same thing happens. Here is a piece of sampe code from the offending container. Ignore the clumsy span tags, it's from fckeditor ......
The div version (it's .net by the way, hence the naff "ct100" in id etc.........):
<div id="ctl00_ContentPlaceHolder_textContainer" class="welcomeTextContainer roundCorner"><img src="images/welcome/uk/your_account_icon.jpg" alt="" style="float:left;" /><p> </p>
<p> </p>
<p><span style="font-size: x-large">Blah blah blah blah blah blah</span></p>
<p><span style="font-size: x-large">blah blah blah blah blahb</span></p>
<p><span style="font-size: x-large">blah blah blah blah blha</span></p><div class="floatClear"></div></div>
And the table version of the same thing :
<table style="float:left; margin:0; padding:0;" cellpadding="0" cellspacing="0">
<tr>
<td id="ctl00_ContentPlaceHolder_textContainer" class="welcomeTextContainer roundCorner"><img src="images/welcome/uk/your_account_icon.jpg" alt="" style="float:left;" /><p> </p>
<p> </p>
<p><span style="font-size: x-large">Blah blah blah blah blah blah</span></p>
<p><span style="font-size: x-large">blah blah blah blah blahb</span></p>
<p><span style="font-size: x-large">blah blah blah blah blha</span></p><div class="floatClear"></div></td>
</tr>
</table>
I've even tried making the container visible = false; in c# then making it visible = true; after it's loaded it with sql content but still the same thing. On first viewing (and first viewing only) the content breaks through the bottom of the div (or table cell). I'm absolutely sure that the floatClear style is in effect too (by checking in firebug).
This is getting frustrating now. The whole cms works apart from this stupid container, which kind of ruins the look of the page......
-
Is there any way to get the <div> .... </div> part put in with the MySQL include script?
Or don't use the include .... put the MySQL part right in the same script?
