Question

所以我开始学习Web的东西。我正在学习Javascript，HTML和CSS。我做了一个小网页。我的大多数CSS工作正常，但我不明白为什么最后一个不适合我。

我的人行类的HTML是

<div class="person-row">
    <img src="images/avatar1.png">
    <div class="person-info">
        <div>Catalina</div>
        <div>sports, pets, party</div>
        <button>Add as a friend</button>
    </div>
</div>

然后在我的CSS中我试图让按钮出现在行的右边，所以我有

person-row > button{
   float: right;
}

但按钮不在右边。谁能告诉我哪里可能出错？

Answer 1

特定于兄弟后代的引用非常具体，但如果它引用了注释中提到的正确父代，它就有效。

此外，没有。在有人提到的类标识符前面。

这是纠正的小提琴：

http://jsfiddle.net/ty6cyxvo/

其中包含：

<div class="person-row">
    <img src="images/avatar1.png" />
    <div class="person-info">
        <div>Catalina</div>
        <div>sports, pets, party</div>
        <button>Add as a friend</button>
    </div>
</div>

和

.person-info > button{
   float: right;
}

不明白为什么我的CSS不起作用

1 个答案: