li 项目符号

JJYY0088 2012-06-14 05:04:43



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<style type="text/css">

ul,li{margin:0; padding:0;  }

ul{border:solid 1px red; padding:5px; width:300px;}

li{ line-height:25px;list-style:inside decimal; clear:both;}

li a{float:left; font-size:14px;}

li span{float:right; color:#999999}

</style>

</head>

<body>

<ul>

    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li>

    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li>

    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li>

    <li> <a href="#">新闻标题1</a><span>06/04/2012</span></li>

</ul>

</div>

</body>

</html>

上面设置左右浮动显示，但是项目符号显示位置不对

------------------------------------------------------------------------------
如果css 改为

ul,li{margin:0; padding:0; }
ul{border:solid 1px red; padding:5px; width:300px;}
li{ line-height:25px;list-style:inside decimal; clear:both;}
li a{ font-size:14px;}/*这里不设置float:left*/
li span{float:right; color:#999999}

但是ie6 时间显示位置不对（换行了），不知道如何清除浮动。。。

如何解决上述问题？？

...全文

195 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

JJYY0088 2012-06-18

打赏
举报

[Quote=引用 1 楼的回复:]
HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type……
[/Quote]

位置相反总觉得怪怪的，不过也简单解决了。。。

三石-gary 2012-06-14

打赏
举报

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<style type="text/css">

ul,li{margin:0; padding:0; }

ul{border:solid 1px red; padding:5px; width:300px;clear:both;}

li{ line-height:25px;list-style:inside decimal; }

li a{ font-size:14px;}/*这里不设置float:left*/

li span{float:right; color:#999999}



</style>

</head>

<body>

<div>

<ul>

    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li>

    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li>

    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li>

    <li> <span>06/04/2012</span><a href="#">新闻标题1</a></li>

</ul>

</div>

</body>

</html>