Css 为什么水平滚动条远远超出了内容？

我正在建立一个博客，有一个大标题图像，目的是填充屏幕顶部（除非在大于1500px的显示器上）-但是滚动条远远超出标题内容，并显示空白

在Ipad上观看时，它会缩小，并在内容一侧显示额外的空间。为什么宽度明显大于图像

以下是网站：

以下是HTML和CSS：

<?php wp_head(); ?>
</head>

<div id="container" class="group">
<div class="outer"><div class="inner"><img src="http://theshalomimaginative.com/weeds/wp-    content/themes/journalist/images/longtop.jpg"/></div></div>

div.inner img { position: relative; left:-50%; }
div.outer {width: 900px; margin: 0 auto; overflow: visible;}
div.inner {display: inline-block; position:relative; right: -50%;}

div.inner img{位置：相对；左：-50%；}
div.outer{宽度：900px；边距：0自动；溢出：可见；}
div.inner{显示：内联块；位置：相对；右：-50%；}

这段代码将标题置于容器之外的中心位置，我的希望是，除非显示器太大，否则它将始终填充屏幕顶部。你知道为什么它会在图像之外创建额外的滚动空间吗

谢谢

试试这个

#container {
width: 911px;
margin: 0 auto;
position: relative;
padding: 0 0 0 140px;
overflow: hidden;
}

试试这个

#container {
width: 911px;
margin: 0 auto;
position: relative;
padding: 0 0 0 140px;
overflow: hidden;
}

---

占用空间的是带有

class=“internal”

的元素。它从其内部的图像获取其大小，然后使用相对定位将图像显示在元素的左侧

---

如果要使用该方法将元素居中，请在其周围放置一个div，该div具有

overflow:hidden和未设置宽度，因此它使用默认的
宽度：auto
，这将占用所有可用宽度。
占用空间的元素是
class=“inner”
。它从其内部的图像获取其大小，然后使用相对定位将图像显示在元素的左侧

如果要使用该方法将元素居中，请在其周围放置一个div，该div具有
overflow:hidden和未设置宽度，因此它使用默认的
宽度：auto
，这将占用所有可用宽度。

您将看到，如果您增加提琴盒的宽度，那么图像将自动增加宽度，而无需任何滚动条。你明白我是怎么做到的吗？让我知道。如果不是，我会解释。简单地说，当你想让一幅图像100%显示在显示器上时，你需要将它放入一个宽度为100%且边距自动的容器中，而不是固定宽度，也没有任何位置。

您将看到，如果您增加提琴盒的宽度，那么图像将自动增加宽度，而无需任何滚动条。你明白我是怎么做到的吗？让我知道。如果不是，我会解释。简单地说，当你想让一幅图像100%显示在显示器上时，你需要将它放入一个宽度为100%且边距自动的容器中，而不是固定宽度且完全没有位置。
我会将它们从容器中拉出。将div.outer移动到标记中div.container的上方，删除div.outer、div.inner的所有css，然后添加文本align:center；拆下外部和内部组件。
我会将它们从容器中拉出。将div.outer移动到标记中div.container的上方，删除div.outer、div.inner的所有css，然后添加文本align:center；拆下外侧部分并完全拆下内侧部分。
这是故意的。我希望图像有那么长——如果我让容器有那么长，它会在左边对齐，而不是像现在显示的那样居中。这是故意的。我希望图像有那么长——如果我让容器有那么长，它会在左边对齐，而不是像现在显示的那样居中。我认为他们不希望图像的宽度达到100%。我想他们想知道为什么div.inner占据了右边的空间。我试过了，但在图像失真或变得太高方面遇到了问题。我想要一个350像素的固定高度，但不希望图片失真。我找不到div.inner，还有，在这种情况下，图像失真是什么意思？我提供的小提琴中的图像总是固定高度（300px），并且没有滚动条？这是一个屏幕截图，显示了在小分辨率（如ipod和android设备）上对css进行一些更改后页面的外观。它可能不准确，但你可以得到一个想法。图像居中，没有任何扭曲，底部的滚动条也不存在。我认为他们不希望图像的宽度达到100%。我想他们想知道为什么div.inner占据了右边的空间。我试过了，但在图像失真或变得太高方面遇到了问题。我想要一个350像素的固定高度，但不希望图片失真。我找不到div.inner，还有，在这种情况下，图像失真是什么意思？我提供的小提琴中的图像总是固定高度（300px），并且没有滚动条？这是一个屏幕截图，显示了在小分辨率（如ipod和android设备）上对css进行一些更改后页面的外观。它可能不准确，但你可以得到一个想法。图像居中，没有任何扭曲，底部的滚动条不存在。div必须在容器内吗？div必须在容器内吗？