【问题标题】：Trying to position elements does not work尝试定位元素不起作用
【发布时间】：2013-12-30 05:10:44
【问题描述】：

我想放置 5 个列块，每个列包含一行文本。我尝试创建一个宽度为 1600 像素的包装类，左右填充 30 像素以及两个对齐的类内容分别位于左侧和右侧，这些类中的每一个都位于包装类中的嵌套 div 中。我给每个 div 设置了 300px 的宽度和 300px 的高度，前四个 div 彼此相邻，而最后一个去右下角。CSS 和 HTML 是 here。

编辑：

主要问题在以下情况下得到解决：

.wrapper
{
    width:1600px;
    height:auto;
    padding:0px 30px 0px 30px;
}

但这似乎超过了屏幕分辨率，需要我水平滚动才能查看所有内容，我该如何处理不同的屏幕分辨率？

【问题讨论】：

您为.content-right 写了css，但您的HTML 代码在哪里？
@ars29 检查包装器内的最后一个 div...如果它在包装器外是否可以工作。
我觉得，不用在CSS或者HTML中加.content-right，.content-left就可以了。
为此类问题创建jsfiddle 始终是一个好习惯，它有助于其他人轻松回答问题。
@ars29 会牢记这一点，还会修改问题以链接到小提琴，而不仅仅是显示原始代码。

标签： css html css-float

【解决方案1】：

试着给width:1600px;

.wrapper
{
    width:1600px;
    height:auto;
    padding:0px 30px 0px 30px;
}

http://jsfiddle.net/sKsZN/

【讨论】：

谢谢，这行得通，我用content-left 定位它，它不适用于content-right（左定位项和右定位项之间有一个空格），现在看起来像我超出了屏幕分辨率，我该如何处理这个问题？
缩小每个div的宽度

【解决方案2】：

尝试对所有<div> 列使用float:left 和display:inline-block。还要确保这些列的总width 不超过.wrapper 的width。

【讨论】：

【解决方案3】：

您应该将float:left 用于您的.content-right 课程。 http://jsfiddle.net/sDyC5/2/

【讨论】：

【解决方案4】：

包装元素 css 宽度属性设置为错误值。您必须设置正确的单位 (px|%|em|ex)。并且还显示：inline-block 和 float 属性不应该一起使用。

【讨论】：