html - List item bullets disappearing in IE6 and IE7 -
I received the & lt; Ul & gt;
and & lt; Created a list of items using li & gt;
. It works fine in Firefox but in Internet Explorer 6 and 7 I can not see the list bullet.
Here's what I did:
I have a global ul, li
reset value. After that I got two & lt; Ul & gt; The two column lists are created using the block
ul li
in the CSS to list the genre as disk
by any overwriting value I am here. When I do this I can see the bulleted list item, but when I set the width of ul
to some specific value then li
bullet disappears in IE goes.
Even if I use the list style as list-style-image: url (bullet.gif)
, that too in IE 6 and 7 does not appear.
HTML code here. Please take a look at this and tell me how I can store the bulleted list in all browsers.
& lt ;! DOCTYPE html public "- // W3C // DTD XHTML 1.0 Transcription / / n" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> & Lt; Html xmlns = "http://www.w3.org/1999/xhtml" & gt; & Lt; Top & gt; & Lt; Meta http-equiv = "content-type" content = "text / html; charset = UTF-8" /> & Lt; Title & gt; List sample & lt; / Title & gt; & Lt; Style & gt; * {Padding: 0; Margin: 0; } Body {font-size: 62.5%; Background color: #ffffff; Font-family: aerial, helvetica, sense-serif; Color: # 000000; Margin: 0; } P, ul {font-size: 1em; } Li {List-style: none; Font-size: 1em}. Clear {clear: both; Height: 0px; Font-size: 0 pixel;} # box 1 {font-size: 1.5m; Margin: 10px 0px 0px 10px; Width: 350px; Border: 1px solid red; Padding: 10px 20px; Clear: both;} # box 1 ul # listLowft {display: inline;} # box 1 ul # list lift lift {list-style: disc; Border: 1px solid red; Width: 150px; Float: left;} # box 1 ul # list right li {catalog-style: disc; Border: 1px solid red; Width: 150px; Float: left;} & lt; / Style & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "box1" & gt; & Lt; Ul id = "elevator" & gt; & Lt; Li & gt; Popular Articles & lt; / Li & gt; & Lt; Li & gt; Submit News & lt; / Li & gt; & Lt; Li & gt; Newsletter & lt; / Li & gt; & Lt; Li & gt; Design competition & lt; / Li & gt; & Lt; Li & gt; List of winners & lt; / Li & gt; & Lt; / Ul & gt; & Lt; Ul id = "right-click" & gt; & Lt; Li & gt; Popular Articles & lt; / Li & gt; & Lt; Li & gt; Submit News & lt; / Li & gt; & Lt; Li & gt; Newsletter & lt; / Li & gt; & Lt; Li & gt; Design competition & lt; / Li & gt; & Lt; Li & gt; List of winners & lt; / Li & gt; & Lt; / Ul & gt; & Lt; Div class = "clear" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Body & gt; You need some margins, padding for Country disk bullet
..
ul li {Try with margin: 0 15px; Padding: 0-15 px; }
And as long as you do not get consistency, keep minimizing left for any of them (I forget what browser uses - you trust one of the lonely May be able to). If you want to use an image usage:
ul li {background: url (/images/bullet.gif); Zoom: 1; }
To oppose IE-Odacity for zoom, sometimes it creates inequalities, though. Do not forget to set the background position on the basis of your design.
Comments
Post a Comment