css - 960 网格中的 100% 宽度页脚

标签 css grid 960.gs

我有一个页脚,我希望使用 960 网格系统将其宽度设为 100%,一切都很好,我可以使用 id 在 div 标签内工作。但是网格一直 float 到页面的左侧,而使用网格的整个站点都位于页面的中心。我试过 prefix_2 向右推,但它没有正确排列。 这是我的代码。

<div id="footer" class="container_12"><img class="prefix_6" id="abs" align="right"     src="#img" width="500" height="258" />
<br /><br />
<div class="grid_2"><p><a href="#link">Home</a></p><p><a href="#link">Services</a></p><p><a href="#link">Plans</a></p></div>
<div class="grid_2"><p><a href="#link">Pricing</a></p><p><a href="#link">Design</a></p><p><a href="#link">Logos</a></p></div>
<div class="grid_2 suffix_6"><p>Call Tool Free:</p><p>1-800-495-5933</p><p><a href="#link">Contact Us</a></p></div>
<div class="grid_6"><a href="#link"><img src="#img" width="16" height="16" />Follow me on Twitter</a> <img src="#img" width="16" height="16" />Become a Fan on Facebook</div>
</div>

CSS:

#footer {
    background-color: #f0e9d8;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    color: #6e2500;
    font-weight: bold;
    height: 250px;
}
#abs {
    position: absolute;
    clip: rect(auto,auto,500px,auto);
}

最佳答案

如果我没理解错的话,您希望页脚的宽度为 100%?这很容易解决。 您只需要在页脚代码周围添加一个包装器。我会这样做:

    <div id="footer">
        <div class="container_12">
            <img class="prefix_6" id="abs" align="right"     src="#img" width="500" height="258" />
            <br /><br />
            <div class="grid_2"><p><a href="#link">Home</a></p><p><a href="#link">Services</a></p><p><a href="#link">Plans</a></p></div>
            <div class="grid_2"><p><a href="#link">Pricing</a></p><p><a href="#link">Design</a></p><p><a href="#link">Logos</a></p></div>
            <div class="grid_2 suffix_6"><p>Call Tool Free:</p><p>1-800-495-5933</p><p><a href="#link">Contact Us</a></p></div>
            <div class="grid_6"><a href="#link"><img src="#img" width="16" height="16" />Follow me on Twitter</a> <img src="#img" width="16" height="16" />Become a Fan on Facebook</div>
        </div>
    </div>

那个的 css 是:

#footer {
    background-color: #f0e9d8;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    color: #6e2500;
    font-weight: bold;
    height: 250px;
    width: 100%;
    position: relative;
}
#abs {
    position: absolute;
    clip: rect(auto,auto,500px,auto);
}

关于css - 960 网格中的 100% 宽度页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17409366/

相关文章:

javascript - dhtmlx 网格只读复选框

ruby-on-rails - 精益样式管理器- Rails SCSS 到样式指南 gem?

html - 如何将页脚保持在页面底部?

Android PixelGrid OnDraw 检查/跟踪当前位置

Tkinter 网格管理器中的 Python 类

CSS float 内联元素 (960 GS)

css - 使用 960.gs 灵活的网格布局覆盖整个客户区域

html - 960 网格 css/html 右对齐

jquery - 将鼠标悬停在 <a> 标签上时子菜单不会停留

javascript - 导入 HTML 文件后未加载横幅