• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 486
  • Last Modified:

CSS Problems in Firefox, Chrome and Safari - Working in IE8

Hi Experts:
I have an unordered list on my website and I use graphics for my bullets.  It displays fine in IE8, but not in Firefox, Safari or Chrome.  I've attached my simple CSS statement and screenshots of the list in IE and in Firefox.  Any help would be appreciated! IE8 List Firefox List
.post_text_grey ul { 
	list-style-image:url(images/check.png);
	vertical-align:middle;
	}

Open in new window

0
sully1958
Asked:
sully1958
  • 3
  • 3
1 Solution
 
stergiumCommented:
try adding this .
list-style-type:square;
and please feedback.
0
 
McOzCommented:
Try putting the url in quotes:
.post_text_grey ul {  
        list-style-image:url("images/check.png"); 
        vertical-align:middle; 
        }

Open in new window


That is the official method, which all major browsers should support.
Cheers
0
 
sully1958Author Commented:
@sterglum & McOz:  Neither of these solutions changed the display.
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
McOzCommented:
Its hard to guess much further without seeing your HTML code... It could be a selector issue as well, maybe FF etc don't even recognise the list as IE does.

Is there an accessible dev page for your site? Or can you post the HTML?

THanks
0
 
sully1958Author Commented:
Here is the HTML that calls the CSS.
<div id="righthalf">
              <div class="section_half">
                <div class="section_title_half">With ProjecTracker&trade; you can . . .</div>
                <div class="post_text_grey">
                  <div class="list">
                    <ul>
                      <li>
                      Create accurate estimates in minutes, not days!</li>
                        <li>Eliminate costly estimating mistakes </li>
                        <li>Access data from any computer</li>
                        <li>Eliminate your boneyard and increase your profits</li>
                        <li>Increase staff productivity</li>
                        <li>Eliminate tedious, error-prone transfer of data between programs</li>
                        <li>Never lose your data to a hard-drive crash or fire</li>
                        <li>Measure roofs from the ground or on the roof</li>
                        <li>Import data from satellite measurement services</li>
                       <li>Deliver accurate proposals to homeowners within minutes</li>
                    </ul>
                  </div>
                </div>
                
                <div class="section_bottom_half"></div>
              </div>
            </div>

Open in new window

0
 
McOzCommented:
Try one more thing: add a slash in front of the image url.
If that does not do it, I would try validating your CSS to make sure it is good.

http://jigsaw.w3.org/css-validator/

Generally FF et al are alot more strict in their interpretation of doctypes, CSS, etc so chances are that they are the ones displaying correctly and IE is just being a bit "loose" in allowing it.

Best of luck!
0
 
sully1958Author Commented:
That fixed it!  Thanks.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now