My bts tribute project 😊

My bts tribute project :blush:
0

this is my first tribute page!
honestly my mind went blank when i started it and still is!
i dont remmember how to center things it doesnt work out :frowning:

https://codepen.io/makizy/pen/pozVNom?editors=1100

1 Like

To horizontally center things, try margin: auto;

https://www.w3schools.com/css/css_margin.asp

1 Like

i tired but it doesnt work i think somthing is wrong with the style tag i opened

To center your h1 element, remove display: inline-block and also margin: auto. Just set the style to
text-align: center

To center image, make image’s parent div ‘text-align: center’ and make image display:inline-block

#img-div {
  text-align: center;
}
#img-div img{
  display: inline-block;
}

Ref: https://www.freecodecamp.org/news/how-to-center-things-with-style-in-css-dc87b7542689/

1 Like

One thing I haven’t see anyone mention yet is the width property. All you really need for centering an object is:

<your-css-selector-here> {
   width: 200px; 
   margin: auto;
}

The way the auto property works is it takes the space available minus the width and spreads it evenly across the left and right margins, which results in a centered object in the DOM.

Hope this helps!