横向和纵向横向滚动站点布局的中心 Div答案

【问题标题】：Center Div on Side-scrolling Site Layout Horizontally and Vertically横向和纵向横向滚动站点布局的中心 Div
【发布时间】：2013-10-23 09:53:17
【问题描述】：

我对 Web 开发很陌生。我根据这个非常简单的教程http://www.sitepoint.com/side-scrolling-site-layout-with-css-and-jquery/为问卷设计了一个简单的横向滚动布局。

查看 jsfiddle 上的示例：http://jsfiddle.net/emon/Rqhcf/6/

主 HTML：

<div id="question01" class="panel">Question 1</div> 
<div id="question02" class="panel">Question 2</div> 
<div id="question03" class="panel">Question 3</div>

主 CSS：

body {width: 6000px; margin: 0;}

.panel {width: 930px; float: left;  padding-left: 30px; padding-right: 1040px;
    padding-top: 45px; background: #eee;}

现在，每个问题都从问题 div 的左上角开始。但是，我想将每个问题水平居中在 div 中（也最好垂直居中）。此外，问题 div 的宽度应取决于浏览器视口，以针对不同的窗口大小灵活居中。

这是一个非常令人沮丧的问题，因为我不知道如何访问视口的宽度。有人对此有解决方案吗？使用纯 html/css 和跨浏览器是否可以做到这一点？

希望有解决方案诺伯特

【问题讨论】：

标签： html layout center css

【解决方案1】：

您好，我希望这可以解决您的问题，请查看http://jsfiddle.net/Rqhcf/30/

让它工作是首要的工作

width: %

【讨论】：