Estoy tratando de hacer un background
con last-child
y no entiendo muy bien por que no aplica el estilo que deseo. Quiero que el ultimo div
que contenga la clase hijo tenga el background
, como puedo hacerlo?. ALGO ESTA MAL.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.hijo {
display: block;
width: 100px;
height: 100px;
border:1px solid red;
}
.hijo:last-child {
background: #ff0000;
}
.hermano {
display: block;
width: 100px;
height: 100px;
border: 1px solid green;
}
</style>
</head>
<body>
<div style="width: 100%; height: 100vh; border: 1px solid #000;">
<div class="hijo">
<p>ESTO ES UN TEST</p>
</div>
<div class="hijo">
<p>ESTO ES UN TEST</p>
</div>
<div class="hijo">
<p>ESTO ES UN TEST</p>
</div>
<div class="hijo">
<p>ESTO ES UN TEST</p>
</div>
<div class="hijo">
<p>ESTO ES UN TEST</p>
</div>
<div class="hermano"></div>
</div>
</body>
</html>