烦人的css+div布局

Question

我有一个css+div布局的问题。我需要将背景div设置为向左调整大小，并将内容位置保持在中心。看看图片：

布局div

正如你所看到的，我需要保持右边的空间固定，但内容也需要居中，背景只需要向左扩展，这可能吗？

Answer 1

我很快就举了一个例子：http://jsfiddle.net/N73QA/

如果你有任何问题，请告诉我。

Answer 2

也许你需要这个

#content{
 float:right;
 margin-right: 10px; /* or more */
 width: ......
}

这将使您的内容保持正确；右边的边距可能需要大于10px，以使其看起来居中

Answer 3

不确定我是否完全理解（你的问题似乎与图表相冲突），但你不能将所有内容都封装在50%屏幕宽度的div中吗？

样式：

#wrapper { width: 50%; }
#header, #bg, #footer { background: #46F; margin-bottom: 1em; }
#header { clear: both; float: right; height: 80px; width: 90%; }
#footer { clear: both; height: 80px; margin-top: 1em; }
#bg { clear: both; float: right; padding: 20px; width: 100%; }
#content { background: #ABF; clear: both; float: right; height: 400px; padding: 20px; width: 80%; }

标记：

<div id="wrapper">
    <div id="header"></div>
    <div id="bg">
        <div id="content">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sollicitudin sodales turpis et ultricies. Sed in enim ligula.
        </div>
    </div>
    <div id="footer"></div>
</div>

包装器占屏幕的50%，而内容可以是固定的，也可以是其百分比。包装器中的所有内容都向右浮动。