*{margin:0 auto} this property applies automatically on all my react pages and components even when i do not import Css file in which include this property *{margin:0 auto} due to this property the alignment in my pages does not work properly
*{margin:0 auto} this property applies automatically on all my react pages and components even when i do not import Css file in which include this property *{margin:0 auto} due to this property the alignment in my pages does not work properly
2
Answers
The CSS rule
*{margin:0 auto;}
will affect the entire application, not just the component or file where it is imported because the asterisk(*)
is known as the CSSuniversal selectors
. This selector is useful when we want to select all the elements on the page.If you want to apply styles only to specific components or elements, you should
avoid using the * selector
and instead apply the styles directly to the specific components or elements you want to style.Reference Link: https://www.geeksforgeeks.org/what-is-the-use-of-asterisk-selector-in-css/
This CSS code
*{margin:0 auto;}
applicable for every react component.(*)
this is a universal selectors.avoid(*)
and it will solve your problem.