css使用float属性内容不显示的原因
#div_diary{border-bottom:1pxdashed#CCCCCC;margin-bottom:20px;width:65%;height:20px;ov...
#div_diary{
border-bottom:1px dashed #CCCCCC;
margin-bottom:20px;
width:65%;
height:20px;
overflow:hidden;
}
.ldt{
text-align:center;
color:#069;
text-decoration:none;
display:inline;
float:right;
}
<body >
<ul>
<li>
<div id="div_diary">
<a href="#">第一期</a>
<label class="ldt">2010-5-21</label>
//用<span class="ldt"></span>也一样
</div>
</li>
<li>
<div id="div_diary">
<a href="#">第一期</a></div>
</li>
</ul>
</body>
样式在上面, 我这样写的话,在DW的可视化界面上可以看到效果,可是在IE6上运行就没有效果了,连2010-5-21这些固定的文字也消失了.
全部代码就是这些,你们可以测试下,帮我找找问题出哪里了 展开
border-bottom:1px dashed #CCCCCC;
margin-bottom:20px;
width:65%;
height:20px;
overflow:hidden;
}
.ldt{
text-align:center;
color:#069;
text-decoration:none;
display:inline;
float:right;
}
<body >
<ul>
<li>
<div id="div_diary">
<a href="#">第一期</a>
<label class="ldt">2010-5-21</label>
//用<span class="ldt"></span>也一样
</div>
</li>
<li>
<div id="div_diary">
<a href="#">第一期</a></div>
</li>
</ul>
</body>
样式在上面, 我这样写的话,在DW的可视化界面上可以看到效果,可是在IE6上运行就没有效果了,连2010-5-21这些固定的文字也消失了.
全部代码就是这些,你们可以测试下,帮我找找问题出哪里了 展开
3个回答
展开全部
出现这种情况是因为你在CSS #div_diary中设了overflow为hidden 。而.ldt中又设了float：left。这样2010-5-21会靠在最左边，在DIV中就会溢出，被稳藏掉了。
你可把CSS改为
#div_diary{
border-bottom:1px dashed #CCCCCC;
margin-bottom:20px;
width:65%;
height:50px;
overflow:hidden;
}
境加宽度。
或把overflow:hidden;去掉。
你可把CSS改为
#div_diary{
border-bottom:1px dashed #CCCCCC;
margin-bottom:20px;
width:65%;
height:50px;
overflow:hidden;
}
境加宽度。
或把overflow:hidden;去掉。
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<style type="text/css">
li {
width:80%;
height:20px;
line-height:20px;
border-bottom:1px dashed #CCCCCC;
margin-bottom:20px;
list-style-type:none
}
span {
display:block
}
#div_diary {
width:65%;
height:20px;
overflow:hidden;
float:left
}
.ldt {
width:20%;
text-align:center;
color:#069;
text-decoration:none;
float:right;
}
</style>
<body >
<ul>
<li><span id="div_diary"><a href="#">第一期</a> </span><span class="ldt">2010-5-21</span> </li>
<li>
<div id="div_diary"> <a href="#">第一期</a></div>
</li>
</ul>
</body>
li {
width:80%;
height:20px;
line-height:20px;
border-bottom:1px dashed #CCCCCC;
margin-bottom:20px;
list-style-type:none
}
span {
display:block
}
#div_diary {
width:65%;
height:20px;
overflow:hidden;
float:left
}
.ldt {
width:20%;
text-align:center;
color:#069;
text-decoration:none;
float:right;
}
</style>
<body >
<ul>
<li><span id="div_diary"><a href="#">第一期</a> </span><span class="ldt">2010-5-21</span> </li>
<li>
<div id="div_diary"> <a href="#">第一期</a></div>
</li>
</ul>
</body>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
I'm sorry
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
