How to make box fill screen with no margin?

Question

It's offset by a few pixels, and margin:0px doesn't work. I want it to fill the full width and start at point 0 of the screen. How do I achieve that?
Using div and css styling.
https://code.sololearn.com/WhQ3Tl67tcVX/?ref=app

Answer 1

.screen{
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 10;// not need.. but when use more than one div and want what will front and what back
background-color:blue;
}

Answer 2

Andre Daniel put this bootstrap stylesheet inside your head tag :
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

or use this :

html { overflow: hidden; }
body { margin: 0 ; box-sizing: border-box; }
html, body { height: 100 %; }

Answer 3

https://www.sololearn.com/learn/CSS/1118/
An element with greater stack order is always in front of an element with a lower stack order.
you can remove that.. without code will run perfectly Andre Daniel

Answer 4

you can also use
*{
margin:0;
}

or
body {
margin:0;
}

Answer 5

Scooby what is z-index and why is it needed?

Answer 6

.screen{
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 10;
background-color:blue;
}