Following the example on w3schools for flex-container, there is following example: 
<http://www.w3schools.com/css/tryit.asp?filename=trycss3_flexbox_flexline>

```css
.flex-container {
  display: -webkit-flex;
  display: flex;
  width: 400px;
  height: 100%;
  background-color: lightgrey;
}
.flex-item {
  background-color: cornflowerblue;
  width: 100px;
  height: 100px;
  margin: 10px;
}
```

```html
<div class="flex-container">
  <div class="flex-item">flex item 1</div>
  <div class="flex-item">flex item 2</div>
  <div class="flex-item">flex item 3</div>
</div>
```

I've attached the result as an image. The image shows a white border between browser edge and flex-container. 

How can I remove the white border? 

[![flex-container with white border around](https://i.stack.imgur.com/fXWlW.png)](https://i.stack.imgur.com/fXWlW.png)