Grow your CSS skills. Land your dream job.

IE8 Not Displaying Background Logo Correctly

  • # January 29, 2013 at 8:10 am

    Hi,

    Hoping someone can assist as to what I need to do to get my site to display background logo correctly in IE8.

    All seems to be working and rendering correctly in all other browsers, i.e. Chrome | Firefox | IE9 | Safari, apart from IE8.

    In order to see the issue, please look at site in Chrome or Firefox first to see what it should look like behind the title “Hello and Welcome” and then look at it in IE8, to see the background logo issue.

    See site at > [http://bit.ly/YBwB0W](http://bit.ly/YBwB0W “http://bit.ly/YBwB0W”)

    Hoping someone can assist with this.

    Thanks.

    Tony ( Soft Principles ).

    # January 29, 2013 at 8:24 am

    Wow….There is some weird positioning going on in there!

    It might have been better to put that image as a background rather than into the HTML.

    # January 29, 2013 at 8:34 am

    Thanks for the reply Paulie_D – any ideas on how to get around it now though?

    # January 29, 2013 at 8:41 am

    OK…here we go.

    In your #slider list the list items are getting inline styling background color of white [actually rgb (0,0,0)]. That is overlaying the image and hiding it.

    You need to find out how to remove that or stop it from being applied. My guess is that it’s a plugin or something.

    # January 29, 2013 at 9:51 am

    Sorry to be a pain Paulie_D but are you able to point me to the css where you still this inline styling of the background. Would appreciate line no, actual lines of CSS.

    Unfortunately I have found the id=”slider” tag but cannot see where the color white – rgb(0,0,0) is being set.

    Would really appreciate it.

    Thanks.

    # January 29, 2013 at 10:04 am

    I have no idea HOW the property is being set, my guess is that it’s somewhere in the plug-in or template you are using.

    TBH, I think the whole page could use restructuring but I’m GUESSING that it’s a function of WP that’s requiring all that odd positioning.

    I’m of the firm opinion that using relative/absolute positioning should only be used for specific effects and used as a last resort only. That doesn’t seem to be the case with what **seems** to be a basic site.

    Perhaps there is advanced functionality to come that I’m not aware of but otherwise…..

    # January 30, 2013 at 7:39 pm

    Hi,

    Just to let you know that I managed to solve this issue in IE8 by adding a z-index:10 to the #logo div style.

    All good now.

    Appreciate your help Paulie_D.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".