Nipuna C
Nipuna C

Reputation: 81

Centering a single component in angular 8 without effecting the styles of child elements inside that component

I want to center div s inside a component without effecting styles of the div s inside that component . How could I do this ?

I am using angular 8 . Text align method effects the alignment of the text inside that div. I want to center elements while preventing that.

Upvotes: 1

Views: 9872

Answers (2)

chrismclarke
chrismclarke

Reputation: 2105

There's lots of ways to center a div and all can be done without impact on child elements. There's a really good list of ways described here:

https://css-tricks.com/centering-css-complete-guide/

For your case the easiest will likely be to add

display: flex; justify-content:center; align-items:center;

For additional help learning flexbox there's a fun game: https://flexboxfroggy.com/

Upvotes: 9

igor_c
igor_c

Reputation: 1250

You can add styles to the component display: flex; justify-content: center

Upvotes: 0

Related Questions