xxxxxxxxxx
.classNameOfImage {
display: block;
margin-left: auto;
margin-right: auto;
}
xxxxxxxxxx
<img src="myImg.png" class="center">
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
xxxxxxxxxx
img {
display: block;
width: 60%; /* Or 600px instead of percentager value */
margin-left: auto;
margin-right: auto;
}
/* This method uses the margin property,
its typically used to center large images.
In this example the browser reads the image as a block element
(not an inline element) thus allowing the CSS margin property to work.
URL = https://blog.hubspot.com/website/center-an-image-in-html */
xxxxxxxxxx
<style type="text/css">
.centerImage
{
text-align:center;
display:block;
}
</style>