Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme »

[SOLVED] Images as bullets in unordered lists - Please help

Old Mar 26, 2012, 07:34 PM
44 posts · Dec 2009
Okay, it's time to stop banging my head against this and ask for help. What am I doing wrong here?

I am trying to style a class of unordered list to use a small graphic instead of a bullet. I combed the forums and read up on various css tutorials and despite my best efforts, it's not working.

Here's what I have put into CSS/HTML inserts:

ul.checklist {
  margin: 0;
  padding: 0;
  list-style-type: none !important;

ul.checklist li {
  margin: 10px;
  padding-left: 18px;
  background: url(/wp-content/uploads/2012/03/checkbullet.png) no-repeat top left !important;
  display: list-item !important; 

And here's the html I am using on the page:
HTML Code:
<ul class="checklist">
<li><strong>Are you <em>widowed, separated or divorced</em></strong> and want to start over, but not sure how?</li>
<li>Do you keep finding the <em>same kind of unhealthy Partners</em> over and over again?</li>
<li>Do you find a “Perfect Partner”, only to find out later, they’re NOT who you thought?</li>
<li><strong>Are you</strong><strong> </strong><em>disillusioned</em> and wondering if there is really anyone out there <em>for you? </em></li>
All the styling except the the graphic bullet seems to be applying. I have checked the url, tried the full path vs. the shortened one, tried it surrounded by single quotes and without. I imagine it's my poor CSS skills that are tripping me up. All help is appreciated!

Atahualpa=3.7.3 (plus patches)
Old Mar 26, 2012, 08:43 PM
lmilesw's Avatar
10,176 posts · Jul 2009
Central New York State USA
I am not sure what is going on. I tried the following and it worked for me in Firebug
HTML Code:
ul.checklist li {
    margin: 10px;
    background: url("http://dreampartner.acenter4growth.com/wp-content/uploads/2012/03/checkbullet.png") no-repeat top left;
    padding-left: 18px;
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
Old Mar 26, 2012, 09:20 PM
44 posts · Dec 2009
Well, gee, I dunno! Your code works fine for me too!

I guess it was the double quotes, because that's the only difference I can see.

Thank you very much.


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] unordered list bullets and photo wrap GrahamW Center area post/pages 2 Sep 4, 2011 11:16 AM
[SOLVED] Ordered and Unordered Lists Overlapping with Pictures GreenEcoChick Page & Category Menu Bars 2 Oct 12, 2010 10:41 AM
Adjusted $allowedtags in kses.php - still no ordered/unordered lists show in comments eraccusa Comments, trackbacks & pings 12 Oct 3, 2010 01:39 PM
[SOLVED] Ordered lists &amp; unordered lists overlapping neighboring pictures Smilesbypayet Customization, Design, Programming... 2 Oct 13, 2009 07:33 PM

All times are GMT -6. The time now is 04:07 AM.

Powered by vBulletin® Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.