Unremovable bullets?

Does your website, theme, or plugin have bullet points that you don’t want and you simply cannot get rid of them?

Little arrows in the Default Theme

Little arrows in the Default Theme

No little arrows in the entry post content

No little arrows in the entry post content

List-style-type: none

You’ve loaded firebug and checked thoroughly and this css code is definitely there:

... li {
list-style-image:none;
list-style-type:none;
}

This happens in the default theme and also recently someone had a similar problem using  my ical events plugin with the mango orange i3theme.

List Item Before Content

In the default theme, this code defining some content before the list item, is creating those nifty little arrows:

.entry ul li:before,
#sidebar ul ul li:before {
    content: "\00BB \0020";
    }

So the fix is to override those css specifcations for all, or just the plugin in question.  For example for the default theme, my plugins css now has:

#sidebar .amrcol  li:before,
.entry .amrcol  li:before {
        /* remove list bullets in the default theme and similar themes */
        content: none;
}

List Item Background Image

Upcoming events bullets or List styles in the Mago Orange theme

Upcoming events bullets or List styles in the Mago Orange theme

In the MangoOrange i3theme this css code defining a background image  is affecting your list items

#sidebar-right ul li,
#sidebar-left ul li {
    background:transparent
    url(images/bullet-orange.gif)
    no-repeat scroll 0 0;


My plugin now removes the bullets just for the lists within its code, but leaves those little arrows for the other widgets in the sidebar.

#wcompprop0 ul li,
#calprop0 ul  li,
#compprop0 ul li {  /* remove list bullets */
	list-style: none;
	text-indent: 0;
	padding: 0;
	margin: 0;
	background: none;
    }

If you still wanted the little arrows, then you need to add back the spec for the field that you have chosen as first in that row, and maybe fiddle with the spacing.

#sidebar .amrcol li.EventDate:before {
	content: "\00BB \0020";
}
No little arrows or bullets in the sidebar

No little arrows or bullets in the sidebar

Post a Comment

You must be logged in to post a comment.