Browser adding 8px margin to page, CSS not overriding

Google chrome seems to be adding a margin of 8px to my body tag and using CSS: body { margin: 0; } does not seem to prevent it. The only way I can seemingly overcome it is by adding the style directly to the HTML element The stylesheet is linked properly as all other CSS is working perfectly fine.

I have tried body { margin: 0 !important; } and this does nothing either. Does anyone have any idea why my CSS does not seem to be working for the body’s margin?

Do you have a live example we can look at?

There should be nothing stopping you from resetting/zeroing out the default body margin.

Here is the live image:

and here is my CSS:

image

Images aren’t super helpful but I can see that no styles are being applied to the body element (other than the browser defaults). So that would suggest that your CSS is not getting applied at all.

I’m guessing if you added a background color it too would not be applied. My only guess is that you are not linking to the CSS file correctly. Are any styles getting applied at all?

Edit: Post an image of your HTML that shows how you are linking to the CSS file. And explain where the CSS file is located in relation to the HTML file.

1 Like

Well wouldn’t you know…I forgot to link the stylesheet properly. I forgot to actually locate the file in my CSS folder, just had the file name…I spent over an hour on this…

1 Like

That is development for you…some times you just can’t win.

It’s why having fresh eyes to look at code can be so valuable. Sometimes all you need to do is talk to yourself and explain the problem, in doing so you may find errors or wrong assumptions made in the process.

1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.