views:

560

answers:

4

It shows in firefox,but no in IE(in fact mine is IE6)

<style type="text/css">
 li { list-style-type:disc; }
</style>

<div style="margin: 2px auto 15px; padding: 5px 0px; width: 480px; text-align: center;">
<ul style="margin: 0; padding: 0; text-align: left; list-style-position: outside; overflow: visible;">
 <li ><em>test.</em> 111</li>
 <li><em>test.</em> 2</li>
</ul>
</div>

Can take a look here:link text

EDIT All requirements:

1.remain the parent div with width fixed.

2.must make <ul> text-align:left;

3.show the bullets

A: 

because of the CSS width attribute.

I suggest you set the width attribute to the li tag instead of the ul


Edit

list-style-position: outside; can make the same problem happen on Firefox

You will have to find another way to style the list, but if you insist on list-style-position: outside; you can use javascript to set the width attribute in the suitable place.

Ahmed Khalaf
No,set width to li will cause it to disapear in firefox,and the bullets looks strange in IE too.
Shore
A: 

i know it`s old style but this should work

<li type="disc">... </li>

it might work.. ie has a lot of problem with css.. problems that will be fixed..

DanTdr
Tried,not working.
Shore
A: 

Try messing with the margin/padding on the ul and give layout to the lis possibly?

ul { margin:0 0 0 10px; padding:0 0 0 10px; }
ul li { zoom:1; }

I forget which one IE cares about but it needs enough space to show them.

meder
A: 

The left edge of lists is always at the text, not the bullet points. In other words, the bullet points are outside the list's bounding box, which makes them disappear for some reason in IE.

Add some left-padding to the list (at least 20px should do it).

I think you also want to add a doctype to the page - on your example page the list should be centrally aligned, but it isn't for me (in IE8) because IE is in quirks mode.

DisgruntledGoat