dcsimg
www.webdeveloper.com
Results 1 to 9 of 9

Thread: IE css background-images missing

  1. #1
    Join Date
    Oct 2005
    Posts
    72

    IE css background-images missing

    Attention all CSS Masters! I have a little issue here.

    All the images (icons) that precede each string of text appear fine in Firefox, but not so in IE, some, but not all of the icons just vanish. Swap between both browsers via the example in the following URL and you'll see what I mean.

    http://stmichaelslegion.com/ie_css_images/

    What has been concluded, in another forum, is that single words receive the style just fine, but if the "icon" style is applied to more than one word at a time, then the images start to drop out.

    I greatly appreciate whatever suggestions anyone might have.

    Thank you!!

  2. #2
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    They look identical to me -
    IE 6, Win xp, svc. pk. 2
    Fx 1.5

    Edit: Never mind -- I see them now -- farther down the page.

    KDLA
    Last edited by KDLA; 06-26-2006 at 03:35 PM.

  3. #3
    Join Date
    Oct 2005
    Posts
    72
    Any takers on this one? It's been a while since I posted it and was wondering if anyone had any other suggestions on it. Thanks!

  4. #4
    Join Date
    Dec 2002
    Location
    Manchester, UK
    Posts
    6,276
    Looks like IE is drawing boxes wrong.

    They came to the wrong conclusion on that other forum by the way.

    What is happening, well, notice how it's only <span>'s that go onto the second line that have the problem, but not all of them. It's only the one's that go onto a second line AND the beginning of the <span> is not at the beginning of the line.

    So while IE puts the bottom border and padding in the right place, it's putting the background image in the wrong top left corner. It's easier to communicate what I mean with an image, so take a look at the attachment.

    As far as a solution goes, I'm not sure yet, perhaps something involving float:left;.
    Attached Images Attached Images
    Last edited by David Harrison; 02-17-2007 at 10:14 PM.
    Every fight is a food fight when you’re a cannibal.

  5. #5
    Join Date
    Oct 2005
    Posts
    72
    Hmm.... interesting... how strange though. I really appreciate you taking a look at this for me. I had given up on it totally!!

  6. #6
    Join Date
    Dec 2002
    Location
    Manchester, UK
    Posts
    6,276
    Here's a solution, requires 1 extra <span> each time though, but it works in IE now.
    Attached Files Attached Files
    Every fight is a food fight when you’re a cannibal.

  7. #7
    Join Date
    Oct 2005
    Posts
    72
    I'll go with it.. I really appreciate your efforts on this one. It's just so disappointing that IE cannot better adhere to CSS standards, like the other browsers, makes life so much more difficult.

    Again, thank you!

  8. #8
    Join Date
    Dec 2002
    Location
    Manchester, UK
    Posts
    6,276
    Yeah, IE is a constant pain.

    What page is this being used on anyhow? And what do all those letters mean?
    Every fight is a food fight when you’re a cannibal.

  9. #9
    Join Date
    Oct 2005
    Posts
    72
    It was going to be used for work, provided it was simple enough to implement such as selecting the appropriate text and applying the necessary style, like any other situation. If IE didn't pose this problem, it could have been used. The icons and the corresponding underlines were to associate what content was relevant to what group.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles