Member Avatar for clekkas

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

  • 3 Contributors
  • 5 Replies
  • 151 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by colweb

Recommended Answers

All 5 Replies

Member Avatar for colweb

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.

Member Avatar for colweb

The copy of the code didn't go correctly. It should start with <html> and just before the body </head>.

Member Avatar for clekkas

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

Member Avatar for MidiMagic

Lists are not block objects, and won't take an image.

Member Avatar for colweb

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. :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.