Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 8 of 8
  1. #1
    Senior Member Ferro's Avatar
    Join Date
    Oct 2006
    Location
    UK
    Posts
    386
    Member #
    14204
    Liked
    5 times
    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.

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    Could we see the site?


  4. #3
    Senior Member Ferro's Avatar
    Join Date
    Oct 2006
    Location
    UK
    Posts
    386
    Member #
    14204
    Liked
    5 times
    Aaaah sorry no, it's an internal company site...... :dead:

  5. #4
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    After the last bit of floated content inside the main div, put the following:

    <div style="clear: both"> </div>

  6. #5
    Senior Member Ferro's Avatar
    Join Date
    Oct 2006
    Location
    UK
    Posts
    386
    Member #
    14204
    Liked
    5 times
    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?




  7. #6
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    Try using <table> instead of <div> and see what happens.
    Tables will render after they're loaded.


  8. #7
    Senior Member Ferro's Avatar
    Join Date
    Oct 2006
    Location
    UK
    Posts
    386
    Member #
    14204
    Liked
    5 times
    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>&nbsp;</p>
    <p>&nbsp;</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>&nbsp;</p>
    <p>&nbsp;</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......

  9. #8
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    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?



Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:43 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com