0
How to get the image in centre in HTML
important
4 Answers
+ 3
An <img> element is already of inline-level type... so to center it, you just need to apply 'text-align:center;' to it container/parent ^^
The solution of <center> is to avoid, as this element is deprecated. If you need to introduce a container for your image, use a <div>, and apply to it the correct/expected behavior... ( use <span> as a generic container of inline block type, as opposite )
+ 1
easiest way to achieve this is:
<center> </center>
0
you could wrap it in
<center></center> tags...
but dont. kinda sketchy.
make a class called centerImg or something. then for that img apply it
<img herf.... class="centerImg"..
then in your styles write
.centerImg {
display:block;
margin-left:auto;
margin-right:auto;
}
that should do the trick.
you might also need to add
margin: 0 auto; but im not 100%.
hope this helps!!
0
using css, write class for img
.img-center {
display: inline-block;
margin-left: auto;
margin-right: auto;
}
or just display inline-block but wrap image in div
.img-wrapper {
text-align: center;
}
<div class="img-wrapper">
<img src="...">
</div>