CODEWITHSUNDEEP
cssinternet-explorerhtml-lists
omg
omg

Reputation: 140072

Why bullet not shown in IE6

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

Upvotes: 0

Views: 1604

Answers (4)

DisgruntledGoat
DisgruntledGoat

Reputation: 72560

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.

Upvotes: 0

meder omuraliev
meder omuraliev

Reputation: 186692

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.

Upvotes: 0

DanTdr
DanTdr

Reputation: 424

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..

Upvotes: -1

Ahmed Khalaf
Ahmed Khalaf

Reputation: 1220

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.

Upvotes: -1

Related Questions