asked on

Bullets are positioned too far to the right

* bullet indented too much
* want it like this

The code that displays the bullet (arrow.png) is as follows -

li

{

line-height: 15px;

padding-left: 15px;

padding-top: 0px;

background-image: url(../images/arrow.png);

background-repeat: no-repeat;

background-x-position: 0px;

background-y-position: 2px;

list-style-type: none;

}

ASKER CERTIFIED SOLUTION

VirusMinus

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

fernbuck

ASKER

Would you please look at http://www.fernbuck.com/pages/template.txt

I am using a template and the code I sent you was lines 11-20.

Am I going to have to go through all the code and remove all the margins and paddings?

Where exactly do I place the ul,li{margin:0;padding:0}

Forgive me I'm a rookie at this.

fernbuck

ASKER

In case your wondering, this is one of the default templates for Joomla 1.0

VirusMinus

put it after the body section in the CSS

and remove the padding from the li

fernbuck

ASKER

Ok great but now the first letter of the text is overlapping with the bullet image. How do I create distance between the bullet and the text? "And that should be it"

fernbuck

ASKER

Replacing {margin:0;padding:0px;} with

ul,li
{
margin-top: 0pt;

margin-right: 0pt;

margin-bottom: 0pt;

margin-left: -5pt;

padding-top: 0px;

padding-right: 0px;

padding-bottom: 0px;

padding-left: 15px;
}

Gave me exactly what I wanted.