При наведении на элемент появляется контент. Как сделать так чтобы данные элементы оставались в одну линию по горизонтали, а контент просто появлялся снизу? (как на картинке). Без использования flexbox
.content {
display: inline-block;
background: #ccc;
padding: 5px;
}
.hide {
display: none;
background: #000;
color: #fff;
text-align: center;
}
.content:hover .hide {
display: block;
}
<div class="content">
hover
<p class="hide">
Text
</p>
</div>
<div class="content">
hover
<p class="hide">
Text
</p>
</div>
<div class="content">
hover
<p class="hide">
Text
</p>
</div>
float: left
в.content
?