CSS Inline list bullet break/wrap fix

Sometimes, an inline list with a background image for the bullet, does not wrap correctly (see left), leaving the bullet hanging at the wrong end of the line.

The solution is to use the CSS2 display:inline-block property (rather than the NOWRAP property), which produces the correct layout (right column), and there is no unwanted line-break after the bullet. This effect may depend on your DOCTYPE, and you may not see the problem at all.

Read more