css - ホバリングの場合、div 内に div を表示する

Question

css のみで、.post要素にカーソルを合わせるとオプションが表示される可能性はありますか。そうでない場合は、非表示にします。

<div class="post">

    <div class="author">
    Yxvasznalskje
    </div>

    <div class="options" style="display:none;">
    Report - Delete
    </div>

    <p>Message</p>

</div>

Answer 1

インラインを削除し、親 div がホバーされているときに内側の div を選択するためにdisplay:none;使用します。.post:hover .options

.options {
    display: none;
}

.post:hover .options {
    display: block;
}

デモを参照してください。