Ahmet emre CETIN Ahmet emre CETIN - 8 months ago 75
CSS Question

Center align images horizontally

enter image description here

I would like to center align images horizontally inside the parent div but I just can't make it happen. How can I do that?

So far I have this:

<div style="display:block;margin:auto;width:auto">
<div style="background-image:url(assets/img/asd.png)"></div>
<div style="background-image:url(assets/img/abc.png)"></div>
<div style="background-image:url(assets/img/asd.png)"></div>
<div style="background-image:url(assets/img/asd.png)"></div>
</div>

Answer Source

you can't. Obviously you are trying to center these images. Just use this instead:

<div style="text-align: center;">
  <div style="display: inline-block;background-image:url(assets/img/asd.png) "></div>
  <div style="display: inline-block;background-image:url(assets/img/abc.png)"></div>
  <div style="display: inline-block;background-image:url(assets/img/asd.png)"></div>
  <div style="display: inline-block;background-image:url(assets/img/asd.png)"></div>
</div> 

And it would be better to use classes and a stylesheet instead of inline CSS....

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download