How to center an img

How to center an img
0

#1
<style>
  .green-text {
    color:green;
  }
  .smaller-image {
    width:100px;
  }
</style>
<h1 class="green-text text-center">Karl Marx</h1>
<a href="#"><img src='//discourse-user-assets.s3.amazonaws.com/original/3X/8/c/8cb74b7339564360d451b4f3484be5340d0da18f.jpg' class="smaller-image"></a>

I can’t find a way to center the image on my project. I’ve tried this --> https://www.w3schools.com/howto/howto_css_image_center.asp and it didn’t work for some reason. Any suggestions?


#2

By the way, I’m confused about the whole

thing. I want my code to be visible but it just shows as what it should look like…

#3

just use this in your css pointing to your image container, or the image itself

.img{
width: 80%; /*I recommend using relative units like percentages*/
margin: 0 auto; /*0 value will be in top and bottom and the auto will set a uniform
 value as the margin of the container or the image for left and right thus, aligning it to center*/
}

#4

Thanks for the suggestion. Turns out I was being stupid and wasn’t clicking the run button. I feel really dumb. Thanks!


#5

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.


#6
<center><image src=""></center>

However, if you want the image load faster, you could try AMP.
Check out all the image in my website, which is coded in AMP,


#8

Here, i found it usefull and handy https://css-tricks.com/centering-css-complete-guide/