Aligning images within <div> tags

Code Help HTML/CSS/JS
6

Hi, @ZoeySmailus! Welcome to Replit Ask! Here are some solutions to your question:

Answer A: Use display: flex in CSS.

.div-class {
  display: flex;
  justify-content: center;
}

This works if you want only your image to be centered, and the image is the only element inside the <div> element.
If not, you can try making a new <div>, like so:

<div>
  <div class="div-class">
    <img src="https://something.com/assets/logo.png" />
  </div>

  <p>Lorem ipsum...
</div>

Answer B: Use text-align: center in the syntax above,
Answer C: Or use @savardo’s answer.


Hope this helps! :slight_smile:
(P.S. if you need help with justify-content and align-items, see this).

1 Like