这是一个非常简单的练习,但我似乎找不到一个简洁的方法来解决它(刚开始学习HTML和CSS)。
我需要使用Flexbox将红色的第5个块(“bloque 5”)置于其他四个块之下。结果应该是:
请问有人可以帮助我吗?这是我到目前为止:
div {
margin: 5px;
border: 1px solid pink;
padding: 5px;
font-family: arial, sans-serif;
font-size: 14px;
}
.contenidor {
width: 760px;
display: flex;
}
div[class*=element] {
width: 100%;
padding: 2px 30px 5px 2px;
}
.element5 {
background-color: red;
}
<div class="contenidor">
<div class="element1">bloque 1</div>
<div class="element2">bloque 2</div>
<div class="element3">bloque 3</div>
<div class="element4">bloque 4</div>
<div class="element5">bloque 5</div>
</div>