Patrick
Patrick

Reputation: 5886

CSS Override Being Ignored

I am attempting to invalidate the default Site.css rule that body has a padding-top: 50px;. My goal is to reduce the whitespace between the Bootstrap 3 navbar and the start of the body content. This doesn't seem to be a property of the navbar that is doing this, it seems to be the default padding on the body.

This is in MVC, so I modified my _Layout.cshtml to include it's own <style> section and added the following to the head section:

.body {
    padding-top: 0 !important;
}

When I view this in the Chrome developer's console, the body element is still taking on the properties from Site.css:

body {
    padding-top: 50px;
    padding-bottom: 20px;
}

My HTML source does show my overrides in the head.

What am I missing here?

Upvotes: 0

Views: 78

Answers (2)

wsc
wsc

Reputation: 916

.body {
    padding-top: inherit;
}

Upvotes: 0

Casper
Casper

Reputation: 592

You are defining the body as a class with the dot, try and remove it, that might be why it dosen't override

Upvotes: 2

Related Questions