DaniWeb IT Discussion Community

DaniWeb IT Discussion Community (http://www.daniweb.com/forums/index.php)
-   HTML and CSS (http://www.daniweb.com/forums/forum143.html)
-   -   Background image is not displayed in IE 7 (http://www.daniweb.com/forums/thread180090.html)

clekkas Mar 5th, 2009 12:55 pm
Background image is not displayed in IE 7
 
Hi everyone,

Kind of a newbie in the web design arena and therefore my apologies if this post is a repeat of a previous one, all the ones I found to be similar didn't seem to fix my problem

I have a list surounded with a class which its purpose is to add a tick for each list item. it works find in FF but of course not in IE7

here is the code 

 

                <ul class="tick-list">                            

                            <li>A&amp;E onsite</li>

                        <li>

                            <img src="/img/scorecards/Fair.gif" alt="Fair" title="Fair" /> blah blah

                        </li>

               </ul>

and here is the css

 



ul.tick-list li {background:#fff url(/img/find-services/listings/tick-list.gif)no-repeat 0 0; padding:0 0 .6em 27px; min-height:21px;}

If anyone can help that will be great

thanks

colweb Mar 6th, 2009 9:05 am
Re: Background image is not displayed in IE 7
 
You should place the list inside a div and give the surrounding div a background. Like so;
<head>

<html>

<style type = "text/css">

        ul.tick-list li {padding:0 0 .6em 27px; min-height:21px;}

        .ulwrapper {background:#fff url(/img/find-services/listings/tick-list.gif) no-repeat 0 0;}

</style>

<body>

        <div class="ulwrapper">



                <ul class="tick-list">

                            <li>A&amp;E onsite</li>

                        <li>

                            <img src="/img/scorecards/Fair.gif" alt="Fair" title="Fair" /> blah blah

                        </li>

               </ul>

        </div>        

</body>

</html>

The above code works in IE 7 and Firefox 3.

colweb Mar 6th, 2009 11:47 am
Re: Background image is not displayed in IE 7
 
The copy of the code didn't go correctly. It should start with <html> and just before the body </head>.

clekkas Mar 9th, 2009 11:58 am
Re: Background image is not displayed in IE 7
 
Hi colweb,

That did the trick, if it is easy to explain why this is needed it will be good to know for future purposes

Thanks for your quick reply and help

MidiMagic Mar 9th, 2009 7:19 pm
Re: Background image is not displayed in IE 7
 
Lists are not block objects, and won't take an image.

colweb Mar 9th, 2009 8:29 pm
Re: Background image is not displayed in IE 7
 
Quote:
Originally Posted by clekkas (Post 821609)
Hi colweb,

That did the trick, if it is easy to explain why this is needed it will be good to know for future purposes

Thanks for your quick reply and help
It seems the problem is solved than. And MidiMagic has already explained why it needs the surrounding div. Please press the "solved" butten next time. :)


All times are GMT -4. The time now is 8:40 pm.

Forum system based on vBulletin Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
©2003 - 2009 DaniWeb® LLC