Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can't remove margins on react web app

I am having trouble removing these huge white margins on my react project. Below are some of the solutions I have tried.

* { margin: 0; padding: 0; }

/-/-/-/

body {
  max-width: 2040px;
  margin: 0 auto;
  padding: 0 5%;
  clear: both;
}

I have tried every variation. My only installed dependencies that should affect anything CSS wise is bootstrap and I don't think thats it. I tried adjusting max-width to a value of 2040px just to test if it would work and there appears to be a limit to which I can set the width. Help would be appreciated.

I should also mention that this is persistent throughout the entire page. This issue is not limited to the background image which I am linking in the css file White Margins

like image 781
gf807 Avatar asked Jun 24 '18 02:06

gf807


People also ask

How do you get rid of the top margin in react?

You have to use background-size: cover property in css.

Why does margin auto not work in react?

You need to add a <div> that wraps all the buttons together and just put margin: auto; on that div , and you can remove the margin:auto; from the buttons.

How do I remove margins from an element?

Adjusting the Margin Size of an HTML Element With CSS You can remove this margin by setting the top and left margin to zero. Like the padding and border, the sizes of specific sides of the margin can be set using margin-left , margin-right , margin-top , and margin-bottom .


1 Answers

All the browsers uses different default margins, which causing sites look different in the other browser.

The * is wildcard, means all elements present in our site (consider as universal selector), so we are setting each and every element in our site to have zero margin, and zero padding, to make the site look the same in every browsers.

If your style not getting applied then you can use !important to override style,

* {    
    margin: 0 !important;
    padding: 0 !important;
}
like image 175
ravibagul91 Avatar answered Sep 22 '22 14:09

ravibagul91