CSS Bullet

[gokeeffe]

Hi,

I'm using the following css code.

With this code i have a div box with text inside,

with each point having a bullet image before the sentence.

Is there anyway to alter the position of the bullet, ie

push it left more. Is it possible to control it's position.

Tks


-------------------CSS Code----------------------

#input_rules{
margin-left:100px;
margin-right:100px;
padding-right:20px;
border: 1px dashed #284279;
background-color:#F7F7F7;
}

#input_rules p {
line height: 1.8em;
color:#000066;
font: normal 0.75em arial;
text-align:left;
}


#input_rules ul {
list-style-image: url(includes/bullet.gif);
}


--------------------HTML Code----------------------

<div id = "input_rules">
<ul>
<ol>
<li><p><font size="+1">&nbsp;Username:</font>&nbsp; Use only letters, numbers, and the underscore. Must be between 4 and 20 characters long.</p></li>
<li><p><font size="+1">&nbsp;Email:</font>&nbsp;Must be a valid email address</p></li>
<li><p><font size="+1">&nbsp;Password:</font>&nbsp; Use only letters and numbers must be between 4 and 20 characters long</p></li>
<li><p><font size="+2">&nbsp;*</font>&nbsp;&nbsp;Represents a required field</p></li>
</ol>
</ul>
</div>

 

[cLFlaVA]

Something like this:

#input_rules ul {
    list-style: square inside url(includes/bullet.gif);
}

or

#input_rules ul {
    list-style: square outside url(includes/bullet.gif);
}

or my preference:

#input_rules li {
    list-style: none;
    background: transparent url(includes/bullet.gif) no-repeat center left;
    text-indent: 5px;
}

*cLFlaVA
----------------------------
[tt]tastes great, less filling.[/tt]

 

[ChrisHirst]

you can use list-style-position: inside|outside;

Chris.

Indifference will be the downfall of mankind, but who cares?

http://www.candsdesign.co.uk

A website that proves the cobblers kids adage.

http://www.cram-system.com

Nightclub counting systems

So long, and thanks for all the fish.