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 5 of 5
  1. #1
    New Coder
    Join Date
    Oct 2006
    Posts
    40
    Thanks
    1
    Thanked 0 Times in 0 Posts

    IE7 and IE6 Browser Issue

    For some reason there is a space between the Primary Content section and the Footer section on a layout that I'm working on. You can view the problem by viewing the following BrowerCam screenshots:

    http://www.browsercam.com/public.aspx?proj_id=494810

    This problem only occurs when using IE7 or IE6 on a Microsoft Operating System.

    The actual layout can be viewed at the following URL:

    http://www.elvioweb1.com/

    The layout validates XHTML Strict 1.0 and CSS 2.1

    My css files can be viewed at the following URL's:

    http://www.elvioweb1.com/css/layoutandstyle.css

    http://www.elvioweb1.com/css/blueprint/screen.css

    http://www.elvioweb1.com/css/blueprint/ie.css

    How can I get rid of the space between my Primary Content section and my Footer?
    Last edited by brayd; 11-06-2009 at 05:07 AM.

  • #2
    Regular Coder
    Join Date
    Nov 2009
    Posts
    110
    Thanks
    7
    Thanked 9 Times in 9 Posts
    Well your global resets are pretty extensive and personally I think they are going beyond the scope of resets and actually applying your own default styles to elements. Personally I would separate them into actual global resets and global styles, but I am very new to CSS myself so don't put too much stock in anything I have to say here.

    I encountered a similar issue myself a while back and it boiled down to the browsers default styles in spite of the fact that I had pretty comprehensive global resets myself. What ended up fixing the issue for me was this:
    * {padding:0; margin:0; border:none transparent 0px;}
    So give that a try and if that that doesn't help then I expect someone else may be able to give you better advice.

    edit: sorry that code for the borders was wrong.. probably wouldn't make much difference since the first value would still set borders to none and usually such problems are margin/padding related so I guess that is why it fixed my problem anyway. In any case it is fixed now (I think?).
    Last edited by linehand; 11-05-2009 at 04:23 PM.

  • #3
    New Coder
    Join Date
    Oct 2006
    Posts
    40
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks linehand but your solution didn't work. Is there anyone else who can help with this problem?

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello brayd,
    It looks like your not clearing your floats in #wrapper...
    Add a background color to #wrapper and you can see it doesn't extend as far as it should. Add overflow:auto;, the floats clear and it wraps everything like it's supposed to.

    Not sure that cures the problem in IE7 though...
    It looks like the odd float order has something to do with it. Try not floating #tertiaryContent once and see what happens.
    Like this -
    Code:
    #tertiaryContent {
    margin: 0 710px 0 0;
    width: 210px;
    }
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    brayd (11-06-2009)

  • #5
    New Coder
    Join Date
    Oct 2006
    Posts
    40
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks Excavator.

    I implemented your suggestions and the layout now displays just fine in IE7 and IE6. I'm absolutely puzzled as to why my code didn't work in IE6 and IE7. It worked in every other browser/OS combination.

    Cheers!


  •  

    Posting Permissions

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