When using grid 960, can I still have a 100% width header section?

前端未结

关注

 5  1119

执念已碎

I want to use a grid system, like say grid 960.

But I want the top header of the website to be 100%, is this still possible?

相关标签:

5条回答

广开言路

2021-01-26 15:13
Yes, it's possible.

The first step is to add this code to your CSS:
```
body,canvas {
    border:0;
    margin:0;
    padding:0;
}
```
Then make a class:
```
.full-width-div {
    width: 100%;
}
```
And then just add it to your HTML like this:
```
<div class="full-width-div"> 
    Your content...
</div>
```
0 讨论(0)
发布评论:

提交评论
- 加载中...
谎友^

2021-01-26 15:20

The 960gs uses a container, or wrapper div with a set width of 960px to form the grid. If you want your header or footer to stretch the entire width of the page, then you should pull that area outside of the 960 px wrapper and give it a width of 100%.

0 讨论(0)
发布评论:

提交评论
- 加载中...

孤城傲影

2021-01-26 15:25

Yes. You can separate header from main content like:

<body>
    <div class="header" style="width:100%;"></div>
    <div class="mainWrapper container_12">
        <div class="grid_6"></div>
        <div class="grid_6"></div>
        <div class="clear"></div>
    </div>
</body>

0 讨论(0)

醉话见心

2021-01-26 15:26

Sure... just manually style the top part to be 100%.

0 讨论(0)
发布评论:

提交评论
- 加载中...

夕颜

2021-01-26 15:37

Sure it is:

<body>
    <div style="width: 100%;">Heading</div>
    <div class="grid-960-container">
        ...
    </div>
</body>

0 讨论(0)