/CSS/How to center a inline block element

How to center a inline block element

Inline block align center

.parent {
  display: flex;
  justify-content: center;
  align-items: center;
}

.child {
  display: inline-block;
}

Source: stackoverflow.com

How to center a inline block element

  display: inline-block;
  position: relative;
  /* Move the element to the right by 50% of the container's width */
  left: 50%; 
  /* Calculates 50% of the element's width, and moves it by that */ 
  /* amount across the X-axis to the left */
  transform: translateX(-50%);

-1

Source: stackoverflow.com

Similar codes

5 votes111 views3 answers
Background-image linear gradient and border radius
CSS
0 vote98 views1 answer
How to remove text selection in css
CSS
11 votes100 views3 answers
Css poppins font
CSS
-1 vote100 views1 answer
Jest to handle css
CSS
0 vote107 views1 answer
Hide scroll bar and show when hover with small size
CSS
9 votes119 views3 answers
Console.log style css
CSS
0 vote214 views1 answer
Apply css on last child in parent div
CSS
0 vote95 views1 answer
Responsive font size with clamp
CSS
3 votes109 views2 answers
Bootstrap 5 pagination
CSS
0 vote110 views1 answer
Alinhar ao centro align item css
CSS