css - 仅使用 2 个 div 的 3 列 css 布局

Question

我正在尝试将页面修复为具有 3 列。我正在尝试处理的内容只有 2 个 div。一个只影响内容的最后一部分，另一个影响整个内容。

基本上这是它现在的样子：

这是第一个内容-------这是第二个内容

                             This is the third content

我一直在尝试将第三个内容推到第三列。我试过使用 float right，它确实移到了第三列，但低于其他内容。我也不能对 margin-top 使用负值，因为如果调整窗口大小，这将与其他内容重叠。我需要发生的是这样的事情：

----这是第一个内容----这是第二个内容----这是第三个内容

我相信我遇到的一个大问题是我不允许编辑页面的 html 文件，所以我正在处理的只是 css 文件。

score 0 · Accepted Answer

像这样的代码：

//Left:
float:left;

//MAIN:
margin-left: 20em; //these will define the width
margin-right: 20em;

//Right:
float:right;

score 0 · Accepted Answer

我认为您应该尝试在名为 Firebug https://addons.mozilla.org/en-us/firefox/addon/firebug/的 Firefox 中使用此插件，因为它会显示您在 CSS 中更改的所有内容在您的浏览器上实时显示，以便您在获得正确视图时可以再次更改它。

在您的情况下，我认为您应该在尝试正确浮动之前尝试检查 div 的大小（宽度和高度）。因为如果宽度不能同时处理它们，浮动右侧将不起作用。

2 回答 2