Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    New Coder
    Join Date
    Aug 2007
    Posts
    10
    Thanks
    0
    Thanked 2 Times in 2 Posts

    Float problem with left and right divs

    Hi all,

    I am working on a site and for some reason everything displays fine in IE7, but in firefox the community forum...
    your wedding . uk . com / community

    ...is pushed down at a certain point, and starts again at the end of the right div holding the ad. if i remove the ad it pushes down to the bottom of the nav bar instead, not as bad but still noticable and not really a fix.

    Its easier for you all to see than for me to start pasting code in, it also happens in the main listing view when you select a listing from the search.

    Does anyone know the reason for this? I haven't made a site with this layout in divs before so i think i must have missed something.

    Any help would be great.

    Cheers,
    Dan

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Its easier for you all to see than for me to start pasting code in, it also happens in the main listing view when you select a listing from the search.
    How can we see it without a URL?

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    New Coder
    Join Date
    Aug 2007
    Posts
    10
    Thanks
    0
    Thanked 2 Times in 2 Posts
    i spaced out the url for the search engines:

    www.yourwedding.uk.com/community
    it also happens on a pages like this:
    http://www.yourwedding.uk.com/listing.php?id=41

    but not
    http://www.yourwedding.uk.com/results.php?key=flower

    which is confusing :P

    Dan
    Last edited by danic85; 08-31-2007 at 02:48 PM.

  • #4
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Quote Originally Posted by danic85 View Post
    i spaced out the url for the search engines:

    www.yourwedding.uk.com/community
    it also happens on a pages like this:
    http://www.yourwedding.uk.com/listing.php?id=41

    but not
    http://www.yourwedding.uk.com/results.php?key=flower

    which is confusing :P

    Dan
    This returns error 404 page not found.

    The other one loads.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #5
    New Coder
    Join Date
    Aug 2007
    Posts
    10
    Thanks
    0
    Thanked 2 Times in 2 Posts

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    I've looked your page http://www.yourwedding.uk.com/listing.php?id=41
    and there is line like
    <div style='clear:both;'></div>
    just two lines above your contact form.
    Have a try after removing it.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #7
    New Coder
    Join Date
    Aug 2007
    Posts
    10
    Thanks
    0
    Thanked 2 Times in 2 Posts
    @effpeetee: are you using IE7? I think the firefox thing happens in IE6 also.

    @abduraooft: When i remove that link it puts the contact form on the right of the contact details block, overlapping with the banner down the right hand side.

    D

  • #8
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Yes. Using IE 7/

    See my signature.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #9
    New Coder
    Join Date
    Aug 2007
    Posts
    10
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by effpeetee View Post
    Yes. Using IE 7

    I've added some screenshots of the forum, in IE7:
    http://www.yourwedding.uk.com/images/ie7.jpg

    and in firefox 2.0.0.6:
    http://www.yourwedding.uk.com/images/firefox.jpg

    I'm assuming it is the clear float divs in the wrong order or the wrong place, as it happens on 2 of the 3 web pages on the site that use a similar layout.

    I can show you the listing page in the same style if you want, but its the same basic thing.

    D

  • #10
    New Coder
    Join Date
    Aug 2007
    Posts
    10
    Thanks
    0
    Thanked 2 Times in 2 Posts
    The problem i'm having seems to be due to the use of floating divs in different areas of the page. I have the two left/right borders, then if i want to float another few divs inside the main content, i can't use the 'clear: both' command without clearing to the bottom of the border content.

    Is there a way i can set the page up without the clear? I can get the page to look perfect by setting the height of each div, but that restricts the amount of content i can enter into each div, which is useless.

    http://www.yourwedding.uk.com/listing.php?id=1
    This page now has a fixed width div for the contact details, so that the contact form appears below it, however the 'associated images' are all float left to allow for the horizontal alignment. Is there a way to achieve this kind of look without having to set a fixed width?
    On firefox the next element below the associated images is pushed down to line up with the bottom of the right banner.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •