I am struggling with centering text and images inside a div that is 190px x 190px. Despite searching on various platforms, including SO and Google, I have not found a simple solution.
Can someone please provide guidance on the easiest way to achieve vertical alignment?
Here is the HTML structure:
<div class="block">
<h2>TITLE</h2><br/>
<img src="...." width="190px"/>
<p>Hello world</p>
</div>
And here is the corresponding CSS style:
.block {
position:relative;
width:190px;
height:190px;
background-color:FFF;
margin:10px;
float:left;
left:-10px;
text-align: center;
padding:10px;
border:solid 1px #CCC;
font-size:small;
}
.block p {
text-align: left;
}