CODEWITHSUNDEEP
htmlcssstyling
Sai
Sai

Reputation: 308

There is a gap at the top of my website

Here is the problem Here is the css Ok so I want to create a simple portfolio website and I am a bit of a novice with HTML and CSS.

    <body>

    <header>

        <h1>Sai Daniels</h1>

    </header>

</body>

That's my HTML and my CSS

   @import
    url('https://fonts.googleapis.com/css?family=Raleway:300,400,700,900');
    body{
    font-family: "Raleway";
    padding: 0;
    margin: 0;
    }

    /** HEADER **/
    header{

    color: #00ff6c;
    text-align: center;
    background-color: #232323;
    height: 1000px;

    }

Even on other questions the answers don't help

I've noticed if I do this it fixes the problem

*{
    margin:0;
    padding:0;
}

The problem is that I'm the only one that has to do this and I've been told doing that can lead to problems.

Upvotes: 0

Views: 301

Answers (2)

Firoz Ahmad Likhon
Firoz Ahmad Likhon

Reputation: 305

Use this in css

h1 {
    margin-top: 0;
}

Upvotes: 4

Chris Happy
Chris Happy

Reputation: 7295

The h1 tag has margin by default by many browsers, such as Google Chrome:

enter image description here

Your code overrides the user agent styles, which is why it works.

I normally use the following code as a quick normalize CSS:

* {
  box-sizing: border-box;
  margin:0;
  padding:0;
}

Upvotes: 1

Related Questions