/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

1 vote262 views1 answer
Cards design html css
CSS
8 votes330 views3 answers
Bootstrap 4 center image
CSS Bootstrap
0 vote275 views3 answers
Save line breaks in textarea
CSS
4 votes278 views1 answer
Orientation css max and min width media query
CSS
1 vote265 views1 answer
Font condensed
CSS
19 votes220 views2 answers
Add font to react
CSS
0 vote257 views1 answer
Page rotate css
CSS
0 vote276 views1 answer
Grippy css
CSS
11 votes237 views1 answer
90deg rotate to left css
CSS
0 vote272 views1 answer
How to some of the list and show some in css
CSS