css3の:empty疑似要素が効かない罠

先生!どうしてもcss3の:empty疑似要素が効きません!どうして!

HTML
<body>
    <div class="test">
    </div>
    <div class="test">
        I will be pink.
    </div>
</body>

CSS3
.test {
  background: pink;
  height: 80px;
  width: 80px;
}

.test:empty{
  background: lime;
}


それはね…余計な改行とスペースが入っているからだよ!!

正しく動作するHTMLはこちら。
<body>
    <div class="test"></div>
    <div class="test">
        I will be pink.
    </div>
</body>

些細だけど、大切。デリケートな子だからね。

コメント

このブログの人気の投稿

[Win]Xboxコントローラーのバッテリ残量確認と電源を切るツールXControllerTool

UWPアプリでSuicaの履歴を複数件読みだす方法