2 ckm Oct 14, 2010 01:29
![](http://www.gravatar.com/avatar/40c2325da45babd415d8c77286ed1601?size=80&default=https%3A%2F%2Fforums.b2evolution.net%2Fmedia%2Fshared%2Fglobal%2Favatars%2Fdefault_avatar_unknown.jpg%3Fmtime%3D1659823855)
My b2evolution Version:
Running 3.3.3 released on 12/15/09.
Website in question: http://carymathews.com
Style sheet: http://carymathews.com/blogs/skins/evocamp/style.css
The "#midcontent" id specifies style for the middle sidebar of the site. It specifies a background-image for a sub-unordered list bullet:
#midcontent ul li ul li {
list-style-type:none;
padding-left:15px;
margin:0;
background:url(img/zekebullet.gif) 0 5px no-repeat;
}
I've added a Universal Item List widget to the middle sidebar with a CSS class "witty". This universal item list will display a single random post of the "sidebar post" type. I want to display this single post without any bullet or image.
I've added a ".witty" selector to my style.css to accomplish this:
/* *** Does not work *** */
.witty ul li {
list-style-type: none; /* ul - changes bullet style */
list-style-image: none;
background-image: none;
}
I've been playing and can get the background color to change:
/* *** Does work *** */
.witty ul {
background-color: green;
}
But I cannot figure out what I need to do to override the prior id selector for this single instance of a sub-list item.
I'm sure there is a simple solution, but I'm starting to go cross-eyed trying to understand the cascading nature of CSS! Thank you in advance for any help provided.
EDIT: added b2evo version in Subject line
EDIT: added SOLVED notation in subject
Found a solution:
By specifying the id, then the class, then the selectors, I was able to override the default background image. I hope this can help someone out in the future.