Solutions to the different performances of ul under Firefox and IE_Experience exchange

I recently made a system template for oblog, which involved ul, so I compiled this article and this big picture.
ul is a very commonly used tag, but because of its different performance under Firefox and IE, it makes people feel that it is a tag that is difficult to control.
Under Firefox, ul has a padding value but no margin value; on the contrary, under IE, ul has a margin value but no padding value. [It can be seen from the comparison of the second and third examples in the figure below]
Under Firefox, the list-style of ul is placed at the outer edge of the content by default. Of course, you can set list-style to the inner edge of the content through css.
By weighing the settings suitable for both browsers: padding:0; margin:0; list-style:inside;. You can also set ul to padding:0; margin:0; list-style:none; and then add a background image to li, which is also a good choice.

<style type="text/css"> body{font-size:12px; margin:20px; line-height:18px;} #box{width:200px; background-color:#CC9; border:#990 1px solid;} #box ul{padding:0; margin:0; list-style:inside decimal; } </style> <div id="box"> <ul> <li>This is the first sentence. </li> <li>This is the second sentence. </li> <li>This is the third sentence. </li> <li>This is the fourth sentence. </li> <li>This is the fifth sentence. </li> </ul> </div>
[Ctrl A Select all Note:If you need to introduce external Js, you need to refresh to execute]