Center align image in a div

Question

I would like to align an image in a <div>, without using any IDs. All of the solutions I've seen have used IDs or classes. I don't want to use those.

CSS

div {
    text-align: left;
 }

div img{
    //Tried many things but no luck
}

HTML

<div>
  <img src="dd.png" />
</div>

How can I center all the images in a div?

Just target it the same way you are already doing it, but apply the styles shown in those answers — IvanS95, Apr 02 '19 at 17:33
Thanks @IvanS95 for making my points for me. OP, you need the right CSS, it's not specific to ID's or div vs. img. — MyStackRunnethOver, Apr 02 '19 at 17:46

Troy · Accepted Answer · 2019-04-02T17:37:39.773

2

I'm not sure about why your current code have default text-align: left for div element.

But please try this one: http://jsfiddle.net/18230pwa/

div img {
    display : block;
    margin : auto;
}

div {
    text-align: left;
}

edited Apr 02 '19 at 17:37

answered Apr 02 '19 at 17:34

Troy

36
3

score 1 · Answer 2 · answered Apr 02 '19 at 18:24

div { text-align: center; }

<div> //Image link </div>

you don't need to specifically target the image. if the image is in the div, it will be centered. you could also use the <center> tag which functions similarly.

if you aren't looking to center it, just use the text-align method above but use the keyword right or left.

Center align image in a div

2 Answers2