remove white border around container using viewport size

Question

I have a white border around my entire website right now that I am trying to get rid of. I looked it up online and found several sources that all say to set margin: 0; but when I did this, it is not removing the white border. I suspect it has something to do with using view width and view height instead of pixels or percentages, so how can I remove the white border without changing the width and height from using the viewport size?

.container {
    width: 100vw;
    height: 100vh;
    background: purple;
    margin: 0;
}

<div class="container">
</div>

What are you adding the margin property to? I created a codepen with your code and added ```margin:0```, and it removed the white border. Use the * selector to target everything on the page https://codepen.io/anon/pen/xBGyxV — Logan Phillips, Feb 27 '19 at 18:32

score 7 · Accepted Answer · answered Feb 27 '19 at 18:33

7

you have to set the margin: 0 property on body not on the div container, hope it helped

body {
    margin: 0;
}

.container {
    width: 100vw;
    height: 100vh;
    background: purple;
}

<div class="container">
</div>

answered Feb 27 '19 at 18:33

Mateus Martins

442
3
16

score 0 · Answer 2 · answered Feb 27 '19 at 18:32

0

* {margin: 0; padding: 0}

I recommend checking basic universal css boilerplate

answered Feb 27 '19 at 18:32

Riskbreaker

4,621
1
23
31

remove white border around container using viewport size

2 Answers2