I have been over and over the the various solutions in http://forum.bytesforall.com/showthread.php?t=1149 but after a couple of hours of getting nowhere fast, I could do with some help!

I am using Atahualpa 353 and WP 3.0 and I am simply trying to get bullets to show in recent comments and recent posts in the sidebar widget. I want the existing 1px border, but both recent comments and recent posts should show as a <ul> with a round gray bullet.

I have a list of "small" jobs to do with the page style of my site www.betpremier.co.uk and each day I try to complete either one larger task or a couple of smaller tasks. I imagined this to be one of those small tasks!

Could somebody please help before my head explodes!

Also, any recommendations for a decent "advanced widget" that allows me to specify a category for recent posts?

Best regards all

Here is a solution

#recent-posts-2 ul li {margin-left:10px;background: url("http://betpremier.co.uk/wp-content/themes/atahualpa353/images/bullets/round-gray.gif") no-repeat scroll 0 7px transparent;padding:1px 5px 1px 12px;}

There are other bullet images in the bullets folder referenced as well or you could make your own.

I have added that directly into the "Add HTML/CSS Inserts" of ATO.

Doesn't seem to solve anything unfortunately.

Here is some code that should affect all the lists in widgets

div.widget li {
background:  url("http://betpremier.co.uk/wp-content/themes/atahualpa353/images/bullets/round-gray.gif") no-repeat scroll 0 7px transparent;
padding-left:20px !important;
}

Sorry Miles. still no effect! I am wondering if something else (stylesheet for a plug-in maybe) is causing a style to be inherited.

I don't know what's happening. It worked in my test environment. Here is a silly thing to try but it has worked at times. Try putting one of the suggestions I gave you at the top of CSS Inserts. If that's where you put it the first time then try the bottom. There have been times when that placement has made a difference.

PHP Code:

div.widget ul li {
padding: 1px 5px 1px 12px !important;
background: url('<?php bloginfo('template_directory'); ?>/images/bullets/round-gray.gif') no-repeat 0 7px;
}

already exists in the ATO CSS/HTML inserts.... shouldn't need anything more imho but having spent so flaming long on this, what do I know??

Maybe someone else will jump in here.

I am using Firefox Web Developer and when I [Ctrl+shift+y] to show the css of a specific element, there is no evidence of the background image!

Unfortunately, this tool does not allow me to copy and paste what I see, but it seems that the HTML/CSS Inserts are not influencing the style of the widgets at all.

Thanks for your help Miles, has me completely flumoxed. Would it help to give you a temp log-in?

Sure... I'll take a look but I am flumoxed too. Maybe that will deflumoxify me.

Sometimes you cant see the wood for the trees...

Forgive me for stating the obvious, but almost certainly I have a rogue element in the html/css inserts or my inserts are not being inserted correctly, so here is the full insert CSS for anybody that has any ideas

PHP Code:

td#header { 
padding-bottom: 15px; 
}
/* removing the padding here and putting them on the sidebars instead. That way the middle column aligns nicely with the header when there are no sidebars */
td#middle {
padding: 0;
}
div.searchbox-form {
margin: 5px 0 15px 5px;
}
div#menu1 ul.rMenu {
background: transparent;
border: none;
}
div#imagecontainer { 
border-top: solid 5px #333; 
border-bottom: solid 5px #333; 
}
div.widget ul li {
padding: 1px 5px 1px 12px !important;
background: url('<?php bloginfo('template_directory'); ?>/images/bullets/round-gray.gif') no-repeat 0 7px;
}
/* Adjustments for the menu bars, which in their default 
state have 1px borders plus -1px margins to avoid 1+1=2px 
borders between neighbor items. */
ul.rMenu-hor ul, ul.rMenu-hRight ul { margin-top: 0px; }
ul.rMenu-hor li { margin-bottom: 0px; margin-top: 0px; margin-left: 0px; }
ul.rMenu-hor { padding-left: 0px; }
ul.rMenu-ver li { margin-top: 0xp; }

div#menu1 ul.rMenu li a, div#menu2 ul.rMenu li a {
padding: 6px 10px;    
}
/* Space between items of page menu bar */
div#menu1 ul.rMenu li {
margin-right: 5px;
}
/* Reset margin for 2nd+ level items */
div#menu1 ul.rMenu li li {
margin-right: 0;
}
/* round corners for page menu bar items 
div#menu1 ul.rMenu li, div#menu1 ul.rMenu li a {
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
*/
/* reset 2nd+ level */
div#menu1 ul.rMenu li li, div#menu1 ul.rMenu li li a {
-webkit-border-top-left-radius: 0;
-webkit-border-top-right-radius: 0;
-moz-border-radius-topleft: 0;
-moz-border-radius-topright: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
}

I am pretty certain I am missing something glaringly obvious.

There was a problem with your css.php file. I had Juggledad take a look and he saw some content missing. I replaced the content of the css.php file and all is good. The css.php file is one of those core files that look like it can be edited to make css changes but can cause issues if it gets changed or is corrupted.