1

这是我的代码：

<html>
<head>
<style>
#wrap{
      border: 1px solid black;
      width: 500px;
      height: 200px;
}

#wrap div{
     border: 1px solid red;
     width: 100px;
     height: 150px;
     float: left;
}

.item2{
   float: right;
}
</style>
</head>
<body>
<div id="wrap">
    <div class="item1"></div>
    <div class="item2"></div>
</div>
</body>
<html>

为什么我的 div item 2 没有正确流动？任何人都可以帮助我吗？

4

4 回答 4

4

因为CSS 优先级。

将您的选择器更改为：

#wrap .item2{
   float: right;
}

见工作演示

于 2012-12-18T09:26:46.790 回答
1

您看到了 CSS 特异性的问题。

这里有一篇很棒的文章：

http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

但是，请尝试以下操作：

<style>
#wrap{
      border: 1px solid black;
      width: 500px;
      height: 200px;
}

#wrap div{
     border: 1px solid red;
     width: 100px;
     height: 150px;
     float: left;
}

#wrap .item2{
   float: right;
}
</style>
于 2012-12-18T09:27:51.767 回答
1 
#wrap div.item2{float: right;}
于 2012-12-18T09:28:28.353 回答
-1

演示
试试这个：

.item2{
   float: right !important;
}
于 2012-12-18T09:27:21.190 回答