Centered bullet in .css

[Louise06]

Hi All,

I inserted this attribute in my .css file.
I wish to know how the centre the text after each bullet.
I also would like to make sure that there is no problem with other browsers.

.links ul li {
	list-style-image: url(r_square.gif);
		}

Thanks for your advice!

L

[Stang02GT]

Hi All,

I inserted this attribute in my .css file.
I wish to know how the centre the text after each bullet.
I also would like to make sure that there is no problem with other browsers.

.links ul li {
list-style-image: url(r_square.gi f);
}

Thanks for your advice!

L

Use this.

[HTML]align="center"[/HTML]

[acoder]

Rather than use an align attribute for presentation directly in the HTML, use text-align in the CSS:

text-align: center;

Hope that helps.

[Louise06]

Hi
Thanks for your reply but it works with FireFox but not for IE 6.0.

Also you suggested to have a text-align = center: where can I add this as I have a lot of text styles in the .css?
I can also do it in HTML directly. Please advice.

Thanks

L.

[acoder]

Does this not work in IE6?

.links ul li {
	list-style-image: url(r_square.gif);
	text-align:center;
}

If not, post the corresponding HTML.

[Louise06]

Sorry, I need to clarify.

I would like the bullet (in this case a customed square) to be aligned with the text. The text is usually in aligned in the left.

As an example, you can see the "
REPLY GUIDELINES" used bulltes on the right of this page.

Thanks

Louise

[acoder]

As an example, you can see the "
REPLY GUIDELINES" used bulltes on the right of this page.

Those are left-aligned. The guidelines ul has the following CSS properties:
[code=css].guidelines {
list-style-image:none;
list-style-position:outsid e;
list-style-type:square;
}[/code]and the li:
[code=css].guidelines li {
font-size:9pt;
margin:0px;
padding:3px;
}[/code]

[Louise06]

Thanks for the guidelines, but my text is centered instead of being left.

Maybe the bullet image is wrong (.gif), red square (4 by 4 pixel).

Thanks

L

[acoder]

Have you got a test page that you can show? If not, attach the image here.

[Louise06]

Have you got a test page that you can show? If not, attach the image here.

Thanks

Here is a similar script to Guidelines:

[CODE=css].links ul {
list-style-image:url(/images/uploaded/Image/Intranet%20pics %20for%20CH/b_d_square.gif) ;
list-style-position:outsid e;

.links li {
font-size:9pt;
margin:0px;
padding:3px;
}
[/CODE][IMG[/IMG] Idon't know how to attach an image.

Louise

[acoder]

You forgot to close the ul CSS rule.

To attach an image, make a post, then edit it, or use the img tag if you've got the image online.

PS. please use [code] tags when posting code. Thanks!

[Louise06]

You forgot to close the ul CSS rule.

To attach an image, make a post, then edit it, or use the img tag if you've got the image online.

PS. please use code tags when posting code. Thanks!

Thanks sure.

It still does not work, the bullets are higher than the text.

.links ul {
    list-style-image:url(/images/uploaded/Image/Intranet%20pics%20for%20CH/b_d_square.gif);
    list-style-position:outside;
 }
.links li {
    font-size: 9pt;
    margin:0px;
    padding:3px;
}

[Louise06]

Sorry I forgot to ask, I am quite happy with the
list-style-type:square; instead. Could I change the color?

Thanks Louise

[acoder]

Yes, just add

color:whatevercolor;

to the style rule.

[Louise06]

Thank you!
This time it works

Louise