固定宽度的CSS内联块

Question

我正在尝试学习设计网站。

1. 有什么办法可以将当前响应式粘性页脚设置为1000px ？
2. 如果可能，在上述条件之上，我希望左右div水平对齐，并且当屏幕折叠时div将变为垂直对齐。

这是我的html / css代码：

的jsfiddle

Answer 1

添加max-width:1000px; 到.wrapper类，并使.content类为float:left

.wrapper {
    margin: 0;
    height: auto; 
    max-width:1000px; /*add this line*/
}

.content {
    background-color: slateblue;
    width: 500px;
    float:left; /*add this line*/
}

演示在 http://jsfiddle.net/Sp2ZW/

Answer 2

你的意思是这样的：

http://jsfiddle.net/S3hMH/1/

html, body {
    margin: 0 auto;
    display: table;
    height: 100%;
    width: 100%;
    width: 1000px;
}

.content {
    background-color: slateblue;
    width: 500px;
display: inline-block;
    float:left;
}

Answer 3

小提琴

如果您对响应式设计还比较陌生，我建议使用框架作为

基础 引导

来问你的问题。

1. 是您可以将页面宽度设置为1000px。

    #wrapper{ margin: 0 auto; width: 100%; max-width: 1000px; } .content{ width: 50%; float:left; } 

   @media screen and (max-width: 480px) { .content{ width:100%; } }

如果由于上述查询而导致屏幕分辨率小于480px，则内容将占据100％的宽度，并水平堆叠。使用％width可以帮助您设计响应式网页