- b2evolution CMS Support Forums
- b2evolution Support
- Templates, skins, XHTML and CSS
- [3.3.3] overriding list bullet styles -- SOLVED
1 ckm Oct 10, 2010 01:20
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.