CODEWITHSUNDEEP
csshtmlbackground-color
MaiaVictor
MaiaVictor

Reputation: 52987

How to make a div cover completely the top of the page?

How to make a div cover completely the top of the page? It seems like the higher position I can place a div isn't the absolute top of the page.

https://i.sstatic.net/NuFEf.png

Upvotes: 0

Views: 969

Answers (6)

Erik Portin
Erik Portin

Reputation: 48

No need for position absolute in this case. You will just break the flow.

I would suggest adding 

body
{
    margin:0px;
    padding:0px;
}

as stated by a couple before me. That should be enough.

Upvotes: 0

Bipin Chandra Tripathi
Bipin Chandra Tripathi

Reputation: 2620

use this and you are done

<div style="position:absolute;top:0px;width:100%;height:100%;margin:0px;padding:0px;z-index:9001;"></div>

Upvotes: 1

mat
mat

Reputation: 1629

I think you're using margins and / or paddings on the top of your page. You could place it absolute as mentioned by the two others, or you can place it relative and adjust the body tag. In this case you'd probably have to do something like this:

body
{
    margin:0px;
    padding:0px;
}

Upvotes: 0

Alex
Alex

Reputation: 344

Check for padding and margins on the html and body elements. Use the following CSS: html, body { padding: 0; margin: 0;} and see if that sorts it.

Upvotes: 4

cheerfans
cheerfans

Reputation: 1

make sure div has style position:absolute; top:0;

Upvotes: 0

Amar Palsapure
Amar Palsapure

Reputation: 9680

Use absolute positioning, with 100% width and height, and use z-index. Set top and left to Zero. You can calculate width and height of page using javascript. 100% doesn't mean you give 100% in CSS, it means actual values of resolution.

Hope this helps.

Upvotes: 1

Related Questions