我正在尝试设置嵌套DIV标签系统,我遇到了一个奇怪的问题。当在浏览器中加载(在OS X中测试,在OS X上测试Chrome和FF)时,两个最里面的div将相互渲染。
看到这个小提琴:http://jsfiddle.net/m48wG/
有问题的DIV是最轻的灰色,有“l4”级。在源代码中,它们看起来像这样:
<div class="box box-horizontal l4" style="width:100px;height:100px;"></dix>
<div class="box box-horizontal l4" style="width:100px;height:100px;margin-left:3px;"></dix>
但是检查浏览器检查器中的元素会给出:
<div class="box box-horizontal l4" style="width:100px;height:100px;">
<div class="box box-horizontal l4" style="width:100px;height:100px;margin-left:3px;"></dix>
</dix>
是什么原因导致了这个问题以及如何解决这个问题?
由于
编辑: 哈哈..对不起,我的坏!谢谢你们,我完全没有看到那个..可能需要去看一个眼科医生;)
答案 0 :(得分:1)
纠正</dix>
到</div>
,你应该没问题
如果您没有立即看到它,请更改
<div class="box box-horizontal l4" style="width:100px;height:100px;"></dix>
到
<div class="box box-horizontal l4" style="width:100px;height:100px;"></div>
以及其他不正确的div。
答案 1 :(得分:1)
<body>
<h1>Jeg er test</h1>
<div class="row l1">
<div class="box box-horizontal l2" style="width:200px;height:200px;"></div>
<div class="box box-horizontal box-auto l2" style="margin-left:3px;">
<div class="box box-vertical l3" style="width:200px;height:100px;"></div>
<div class="box box-vertical box-auto l3" style="margin-top:3px;">
<div class="box box-horizontal l4" style="width:100px;height:100px;"> </div>
<div class="box box-horizontal l4" style="width:100px;height:100px;margin-left:3px;"> </div>
</div>
</div>
</div>
</div>
</div>
</body>
答案 2 :(得分:0)
这只是你的结束标签中的拼写错误。 </dix>
应为</div>