Question

您好我很好奇是否有人可以帮助解决这个问题。我正在创建一个单页设计网站。问题似乎是在我的CSS（strecth2类）中。标题应固定并跨越100％的屏幕;然而，拉伸类推动整个网页向右推进20％。

我正在使用基础5，并试图获得5个均匀间隔的列。这是我描述的问题的HTML。

<div class="row">
    <div class="stretch-2">
        <div class="small-12 medium-4 large-2 columns">5</div>
        <div class="small-12 medium-4 large-2 columns">6</div>
        <div class="small-12 medium-4 large-2 columns">7</div>
        <div class="small-12 medium-4 large-2 columns">8</div>
        <div class="small-12 medium-4 large-2 columns end">9</div>     
    </div>
</div>

我的CSS：

.stretch-2 {
    width: 120%;
}

.row {
    max-width: 80em;
    padding-left: 2em;
    padding-right: 2em;
}

基金会5 CSS：

.row {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  max-width: 62.5em;
  *zoom: 1; 
}

Answer 1

更改

.stretch-2 {
    width: 120%;
}

到

.stretch-2 {
    width: 100%;
}

在你的CSS中

。

或者，把它放在你的CSS中：

body{
  overflow-x:hidden;
}

新网站的宽度＆gt; 100％

1 个答案: