SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    Foozle Reducer ServerStorm's Avatar
    Join Date
    Feb 2005
    Location
    Burlington, Canada
    Posts
    2,699
    Mentioned
    89 Post(s)
    Tagged
    6 Thread(s)

    stretch bar no longer working in IE

    Hi,

    I have a site originally designed as a static site http://www.aaro.ca. Recently the customer wanted me to turn the site into a CMS. I have used Wordpress and developed a template similar to their static site, for the moment this site is http://test.liviam.ca

    If you go to http://www.aaro.ca then you can see the blue gradient bar beneath the main menu. The relevant css to get the 2px graphic that is stretched to create the bar is:
    Code:
    .stretchbg {
        position:relative;
        display: block;
        height: 52px;
        margin-top: -41px;
        width: 100%;
        z-index:3;
    }
    
    .stretchbg img {
        height: 52px;
        margin: 0;
        padding: 0;
        z-index:3;
        display:block;
    }
    if using I.E. 8 you look at the same bar on the http://test.liviam.ca then the blue bar does not stretch correctly. However on the static site the http://www.aaro.ca site does render correctly on I.E. 8.

    In Wordpress, the plugins and so forth use inline css and load css styles on their own that could effect the way this is rendering. However using Firebug the styles that are being applied don't differ between the two sites yet the Wordpress bar looks like it was vertically divided?

    Do you think this is CSS related?

    Regards,
    Steve
    ictus==""

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,374
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    I've had a look and I can't see a difference between ie8 for both sites and Firefox.

    I must be looking at the wrong thing Do you have a screenshot of the problem as the menu background seems to extend ok in IE8. You do need a min-width on the menu bar to stop the white gap when you scroll at narrow widths.

  3. #3
    Foozle Reducer ServerStorm's Avatar
    Join Date
    Feb 2005
    Location
    Burlington, Canada
    Posts
    2,699
    Mentioned
    89 Post(s)
    Tagged
    6 Thread(s)
    Hi Paul

    This is what I see on the Wordpress site:
    aaro_menu_ie_8_wordpress.png

    and on the static site render on the same browser/computer as the screen capture above, it is correct:
    aaro_menu_on_static_ie.png

    Is that not the way you see it as I tested it by remoting into Windows machine outside our network and it looked the same?

    Thank you about the tipe for min-height!

    Regards,
    Steve
    ictus==""

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,374
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    IE8 looks fine to me and browsercam seems to confirm its ok in xp.

    IE7 is showing the half bar though but I assumed you weren't supporting IE7.

  5. #5
    Foozle Reducer ServerStorm's Avatar
    Join Date
    Feb 2005
    Location
    Burlington, Canada
    Posts
    2,699
    Mentioned
    89 Post(s)
    Tagged
    6 Thread(s)
    Hi Paul,

    Thanks, I am not sure why it is rendering that way on my network? The only thing I can think about is that our firewall is caching and not serving the graphic correctly? Thanks for checking it out.

    Actually with I.E. 7 I have a conditional comment that renders just a blue bar for I.E. 7 but this CSS is not active in the Wordpress site yet.

    Regards,
    Steve
    ictus==""

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,374
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by ServerStorm View Post
    Hi Paul,

    Thanks, I am not sure why it is rendering that way on my network?
    Is your server adding code above the doctype as that will cause IE to go into quirks mode?

    Vista IE8 is also looking good according to browsercam.


Bookmarks

Posting Permissions

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