I don't want to set any fixed heights to any element, is this possible?
<div class="floated">
<div class="Content">
<p>text</p>
</div>
</div>
I don't want to set any fixed heights to any element, is this possible?
<div class="floated">
<div class="Content">
<p>text</p>
</div>
</div>
body {
height : 1000px; /* needed to let the height percentage "MyDiv" correctly work */
}
#myDiv {
position : relative;
height : 20%;
display : table;
border : solid 1px black; /* to see the behaviour of the div, can be removed */
}
#myContainer {
display : table-cell;
vertical-align : middle;
}
<body>
<div id="myDiv" >
<div id="myContainer">
my super content !
</div>
</div>
</body>
Use display : table
on a first div container, and display : table-cell
in the sub div containing your text, or image, ....