Soprano
Member
Posted 2 years ago #
I'm trying to add a bullet (list-style-type:disc) in front of every Recent Posts, Popular Posts, Random Post list item in the sidebar block of this theme:
http://wordpress.org/extend/themes/cordobo-green-park-2
The link to the style sheet is here:
http://wp-themes.com/wp-content/themes/cordobo-green-park-2/style.css
I tried adding:
list-style-type:disc
to:
div#sidebar ul.group {
float: left;
margin: 0 0 0 10px;
overflow: hidden;
padding: 0;
width: 148px;
list-style-type:disc
}
and
div#sidebar ul.sb-list {
margin-left: 10px;
}
but it didnt work, I'm a css illiterate so I'm probably doing something wrong, any help would be GREATLY appreciated :).
Thank you,
Since there is no padding on the <ul> there is no where for the bullet to show. There are two different solutions that I think should work. Feel free to try them both and see which suits you. Either ad
list-style-position: inside;
or change
padding:0; to padding:0 0 0 15px;
in the ul.group styles. Hope that helps!
Soprano
Member
Posted 2 years ago #
Thanks for replying :),
I tried adding: padding:0 0 0 15px; but the bullets came out of alignment with the title of each post, so I tried creating the LI its own class and using the style-position as you suggested and added this to the style sheet:
div#sidebar ul.group li {
list-style-position: inside;
list-style-type:disc
}
the bullets now aligned but for some reason a bullet kept floating ontop of each widget titles block, this is a SS:
http://f.imagehost.org/0250/bullets.jpg
not sure what it could be :S, what whould happen if I wanted to add a small image with an arrow instead? maybe it might be easier...
ah!,i wanted to do that as well with the little > infront of every sidebar item but gave up cuz i couldnt figure out how to do it
lelandf
Member
Posted 2 years ago #
Soprano, try this instead to remove the dot next to the titles:
div#sidebar ul.group li ul {
list-style-position: inside;
list-style-type:disc
}
Pretty sure that would work, but let us know if it doesn't.
The bullet shows up above the <h2> tag because headings are always on their own line. Since you have "list-style-position" set to "inside" the heading moves down to it's own line. Try this:
list-style-position:outside;
However, now that the disc is on the outside we have to make room for it. Change: padding:0 0 0 15px; to margin:0 0 0 15px; and let us know how it goes.
Rosa04
