<br />不在IE中工作

Question

<br />不在IE中工作

我的代码在firefox(TEXT2顶部的TEXT1)和chrome上完美地工作,但在Internet Explorer中没有.这是我的代码.注意TEXT1和TEXT2替换了原始代码中的其他html元素,只是使用TEXT来简化代码.谢谢.

    <div style="float:left;">
     <span class="line-1">
      TEXT1
     </span><br />
     <span class="line-2">
     TEXT2
     </span>
     </div>

Run Code Online (Sandbox Code Playgroud)

CSS

    .line-1{
    margin:3px; 
    padding:5px;    
    background:#F0F2F5; 
    float:left;
   -moz-border-radius:3px;
   -webkit-border-radius:3px;
    border-radius:3px;
    border-left:solid #B6BBC3 1px;
    border-right:solid #B6BBC3 1px;
    border-top:solid #B6BBC3 1px;
    border-bottom:solid #B6BBC3 1px;
    width:220px;
   -moz-box-shadow: 0px 4px 1px #F0F2F5;
   -webkit-box-shadow: 0px 4px 1px #F0F2F5;
    box-shadow: 0px 4px 1px #F0F2F5;}

    .line-2{
     color:#808080;
     font-size:11px;}

Run Code Online (Sandbox Code Playgroud)

Answer 1

Cor*_*son 6

替换clear: both;为display: inline-block;

另外,你宣布了一个doctype吗？doctype告诉浏览器您正在使用的HTML版本,以便浏览器可以正确呈现它.

在页面顶部(<html>标签上方)放:

<!DOCTYPE html>

Run Code Online (Sandbox Code Playgroud)

这使用HTML5文档类型,它允许非常灵活的HTML代码,并希望能够正确显示您的页面.

在HTML5中,您可以通过多种不同方式编写标记.
<br>是有效的,因此<br />HTML5的一个新功能是,对于一个空div,你可以实际使用<div id="emptyDiv" />或<div id="emptyDiv"></div>

您也可以验证HTML标记.
W3C标记验证服务是一项免费服务,允许您上传代码或链接到它,然后对其进行验证并打印错误/警告.一些警告有点神秘,特别是对于有HTML的初学者,但如果你有一些警告/错误,任何浏览器都值得使用将会"弄明白"并正确渲染HTML(不是世界末日).它被称为Quirksmode).其中一些验证器比它们应该使用的更复杂/更复杂,所以你必须找到你最喜欢的那个并坚持下去.

归档时间：	14 年前
查看次数：	5558 次
最近记录：	13 年，2 月前