Forum Moderators: not2easy
<snip>ooops sorry no URLS, per TOS #13 [webmasterworld.com]
tried with margin, padding, border set to 0 on IE - nothing works - i would like 2 pixels space between image and text
[edited by: SuzyUK at 11:18 am (utc) on May 18, 2004]
[edit reason] URL snipped [/edit]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Bullet images</title>
<style type="text/css">
#nav
{
margin-left: 2px;
padding-left: 2px;
list-style: none;
border:1px solid gray;
}
#nav li
{
padding-left: 8px;
background-image: url(http://www.example.com/mO.gif);
background-repeat: no-repeat;
background-position: 0 50%;
}
</style>
</head>
<body>
<ul id="nav">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</body>
</html>
[edited by: SuzyUK at 11:19 am (utc) on May 18, 2004]
[edit reason] examplified URL [/edit]
I've found that the use of background images instead of bullets (list-style-image) does offer more control in situations like this.
AFAIK there is a way to increase the indent between bullet and text, but not decrease it.. but this solution offers more flexibility for positioning the image overall..
Thanks
Suzy
