如果我的浏览器窗口小于div的内容，我向右滚动时，100％宽度div将被切断 [英] 100% width div gets cut off when I scroll right if my browser window is smaller than div's content

问题描述

我在我自己的网站上有一个问题，它有一个< div> ，应该有100％的宽度。它的代码如下所示。

I had a problem on my own site with a <div> that is supposed to have 100% width. The code for it is shown below.

#myDiv {
    width: 100%;
    height: 160px;
    background: #f48;
}

这个工作非常好，除了以下问题：

This works great except for the following issue:

当我的浏览器窗口小于< div> 的内容，我向右滚动，然后我的< div> 将向左移动页面的其余部分，而不是占据页面可滚动区域宽度的100％。

When my browser window is smaller than the <div>'s content, and I scroll to the right then my <div> will move left with the rest of the page rather than occupying 100% of the width of the page's scrollable area.

这个问题已经bug了我几个小时，刚刚我意识到，许多其他网站有同样的问题。包括Facebook.com和Stackoverflow.com只需查看下面的快照。

This issue has been bugging me for a few hours and just recently I realized that many other sites have the same issue. Including Facebook.com and Stackoverflow.com just take a look at my snapshots below.

Facebook的Bug：

Stackoverflow的错误：

推荐答案

我只需要将 min-width 属性设置为< div> 的内容的宽度。

Ok, solved it! I just have to set the min-width property to the width of that <div>'s content.

感谢各位！

这篇关于如果我的浏览器窗口小于div的内容，我向右滚动时，100％宽度div将被切断的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！