出于某种原因，我的背景不是高分辨率直到最后？

Question

我有这个页面：

link

底部是两个div（bottom stanga and bottom dreapta）`

请看下面的图片，了解高分辨率会发生什么。

代码HTML：

<div class="continut">
<div style="height:60%;" class="carousel">[image-carousel category="test"]</div>
<div class="banner-mobile">The top div</div>
<div class="bottom stanga">bottom left</div>
<div class="bottom dreapta">bottom right</div>
</div>

CODE CSS：

.bottom {
  float: left;
  width: 50%;
height:40%;

}
.stanga {
  background:url("http://bagel.dg-site.com/bagel/wp-content/uploads/2015/07/NEWS1-300x246.png") no-repeat center center #B03D3D;
 -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

}
.dreapta {
   background:url("http://bagel.dg-site.com/bagel/wp-content/uploads/2015/07/NEWS2-300x246.png") no-repeat center center #B03D3D;
  -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

问题只在于高分辨率......你能告诉我，我们的思维方式有什么好处吗？

提前致谢！