DIV+CSS教程_解决<li>标签在IE6里面的异常浮动
<ul>
<li>文章标题<span style="float:right;">发表时间2010/02/08</span><li>
<ul>
在新闻列表中,发表时间一般要右浮动的。在FF和IE7如期实现,但在IE6中会浮动到下边。如果“文章标题”文本加上<span>左浮动的话,列表样式黑点就会浮动到右边。请教高手们该如何解决?
解决方法
<ul>
<li>文章标题<span style="float:right;">发表时间2010/02/08</span><li>
<ul>
在新闻列表中,发表时间一般要右浮动的。在FF和IE7如期实现,但在IE6中会浮动到下边。如果“文章标题”文本加上<span>左浮动的话,列表样式黑点就会浮动到右边。请教高手们该如何解决?
1.楼主写的代码没有闭合,这是非常不好的习惯。
2.这个问题有两个解决方法
首先来说第一个,要用到float属性,但要对楼主的代码结构进行一下修改。 代码如下。
<!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>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>文章标题发表时间2010/02/08</title>
</head>
<body>
<ul>
<li style="width:300px; list-style:none;"><span style="float:right;">发表时间2010/02/08</span>文章标题</li>
</ul>
</body>
</html>
第二个,要对文章标题进行左浮动,并且给li设置text-align:right;属性同样可以达到楼主所要的结果。
<!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>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>无标题 1</title>
</head>
<body>
<ul>
<li style="text-align:right; height:30px; width:300px; list-style:none;"><span style="float:left;">文章标题</span>发表时间2010/02/08</li>
</ul>
</body>
</html>