问题描述
我在我自己的网站上有一个问题,它有一个< 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将被切断的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!