#cont {
position: relative;
background: red;
height: 500px;
width: 500px;
}
#ms {
font-size:20px;
position: absolute;
top:50%;
left:50%;
transform: translate(-50%, -50%);
}
<div id=cont>
<div id=ms>
ТекстТекстТекстТекстТекст<br>
ТекстТекстТекстТекстТекст<br>
ТекстТекстТекстТекстТекст<br>
ТекстТекстТекстТекстТекст<br>
</div>
</div>
Блок по центру, но если высота габариты его будут меньше содержимого, получится слудующее
#cont {
position: relative;
background: red;
height: 200px;
width: 200px;
}
#ms {
font-size:20px;
position: absolute;
top:50%;
left:50%;
transform: translate(-50%, -50%);
}
<div id=cont>
<div id=ms>
ТекстТекстТекстТекстТекст<br>
ТекстТекстТекстТекстТекст<br>
ТекстТекстТекстТекстТекст<br>
ТекстТекстТекстТекстТекст<br>
</div>
</div>
Вопрос в том, как выровнять дочерний блок по центру и сделать так, чтобы ширина и высота родителя не были меньше дочернего.
Главное, содержимое родиеля может быть любым, может это список статей, выравнивать его по центру не нужно, возможно статей нету и необходимо выровнять дочерний блок.
То есть возможно ли выровнять дочерний блок, присвоить какие либо свойства но при этом не трогать родителя.
Другими словами, сделать дочерний блок блочным и выставить его по центру