li里的文章列表左右分浮动

一般思路(错误做法)

<div>
	<ul>
		<li><a href="#" mce_href="#">文章标题</a>发表日期</li>
	</ul>
</div>

正确做法

<div>
	<ul>
		<li>发表日期<a href="#" mce_href="#">文章标题</a></li>
	</ul>
</div>

然后利用CSS,设置“文章标题”左浮动,“发表日期”右浮动,当然实现方式有多种,样式可以定义在div里,也可以定义在ul,也可以定义在li里,亦可以在li里添加div或者span均可。正常人的思路都是:左对齐的就放在左边啦,右对刘的放右边啦!如上面代码一样

问题出现: 在firefox等严格按照CSS反映出效果;但在IE里,这li里面的内容就不在同一行了,“发表日期”会跳到下一行里。

解决方法: 将”发表日期”放在”文章标题”前面,这样浮动就不受影响了。

本文为“技术点滴”的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注