CODEWITHSUNDEEP
htmlcssmargin
Fishy
Fishy

Reputation: 377

Why is there a 8 pixel border to my CSS?

I have an 8 pixel border that I'd like to increase, but I can't find where it's coming from. Also, if I use margin, it disproportionally adds to the border.

8 extra pixels? Why?

The CSS and the entire project is available here: CSS Resume Project

    @font-face {
    font-family: "Open Sans";
    src: url(Open_Sans/OpenSans-Regular.ttf);
}
.global {
    /*border: solid 10px lightgray;*/
    border-radius: 25px;
    font-family: 'Open Sans', sans-serif;
    background-color: white;
    /*position: absolute;*/
    top: 20px;
    margin-bottom: auto;
    padding-bottom: 20px;
    right: 20px;
    left: 20px;
    align-self: center;
}

h3 {
    font-weight: 300;
}

p {
    font-weight: 300;
}

body {
    background-color: lightgray;
}

Any help or even a pull request would be greatly appreciated. Thanks.

Upvotes: 5

Views: 2848

Answers (3)

dippas
dippas

Reputation: 60573

because it has a margin set by default and the user-agent-stylesheet looks something similar to this:

body {
  display: block;
  margin: 8px
}

so , simply reset margin in body

body {
  margin:0
}

Upvotes: 11

Guilherme Oliveira
Guilherme Oliveira

Reputation: 2369

body element has 8px margin set as default by browsers.

You just need to change the margin of the body tag

body { 
    margin:20px;
}

Upvotes: 1

solimanware
solimanware

Reputation: 3052

You can reset/normalize your code by adding this code !

body {
  margin: 0
}

Upvotes: 1

Related Questions