TalkPHP - View Single Post

Salathe · 09-12-2007, 03:26 PM

Rather than using the list-style-image property, you can set some (left) padding on the li elements and apply the bullet image as a background. With this technique you could have right-aligned bullets, if you wished. :)

Code:

#sidebar .sidebar-list {
    position: relative;
    left: 33px;
    margin-top: 10px;
    list-style: none;
}

#sidebar .sidebar-list li{
    margin-top: 15px;
    padding-left: 20px;
    background: transparent url(images/bullet.gif) no-repeat 0 0;
}

09-12-2007, 03:26 PM	#2 (permalink)
Salathe Moderateur Join Date: Apr 2007 Posts: 1,393 Thanks: 5	Rather than using the list-style-image property, you can set some (left) padding on the li elements and apply the bullet image as a background. With this technique you could have right-aligned bullets, if you wished. :) Code: #sidebar .sidebar-list { position: relative; left: 33px; margin-top: 10px; list-style: none; } #sidebar .sidebar-list li{ margin-top: 15px; padding-left: 20px; background: transparent url(images/bullet.gif) no-repeat 0 0; }