无法获得页面的全宽和图像div的大小不正确

Question

我已经用了一个代码示例来解释：

http://codepen.io/djnutron/pen/gPJzGJ

基本上，我想知道为什么html和body标签不会全宽。我的屏幕是1920x1080，但html标签拒绝1920年 - 由于某种原因它总是到1903年？知道为什么吗？ img标签的父div也在某处添加一些填充 - 因为img是1900宽，周围的div是1903？我想知道这个填充物来自哪里？我已经尝试添加display：block，还有vertical-align：top到图片，但没有骰子......

以下是代码：

HTML

<div class="gallery"  >
  <div class="gallery-cell">
    <div class="innerG">
      <img src="http://lorempixel.com/image_output/animals-q-c-1900-850-2.jpg" />
    </div>
  </div>
  <div class="gallery-cell">Lorem ipsum dolor sit</div>
</div>

CSS

html, body {
  padding: 0;
  margin: 0;
}

* {
  box-sizing: border-box;
}

.gallery-cell {
  padding: 0;
  margin: 0;
}

Answer 1

我相信情况就是这样：

  

滚动条宽17像素

你也称之为＆＃34; innerG＆＃34;是显示块，因此它具有整页的宽度。任何地方都没有隐藏填充。 ：）

只需缩小即可看到它的大小正在变化以匹配屏幕宽度

Answer 2

如果您希望始终具有完整的body宽度，可以在CSS中设置：

html, body {
  padding: 0;
  margin: 0;
  min-width: 1920px;
}

Answer 3

您可以尝试将HTML和正文设置为width: 100%;

是否有任何内容长于窗口的高度？如果是这样，可能是Silviagreen所说的滚动条。