html

Question

我想要两列，其中第一列是图像，第二列是文本。如果可能，我想避免使用 html 表格。我希望第二列的文本左对齐，这样它将与图像对齐并转到页面宽度的其余部分

我看到我可以为第一列做这样的事情：

 #left_col {
       float:left;
        width: 650px;
    }

但无法找出第二个正确的css（我在网上看到的所有示例都右列右对齐）。在 CSS 中拥有两列的最佳方法是什么，第一列是固定的，第二列是左对齐（在图片的右侧）？

score 1 · Accepted Answer

你可以尝试类似的东西；

#image, #text{
    position: absolute;
}
#image {
    top: 0;
    width: 650px;
}
#text {
    top: 0;
    left: 650px;
    right: 0;
}

这是一个工作小提琴。

score 0 · Accepted Answer

您的 2 列将具有完全相同的 CSS，其中宽度是总宽度的一半。这是一个基本的网格布局，如果您想进一步研究它:)

score 0 · Accepted Answer

检查http://jsfiddle.net/EyKZ7/，将第二列保留width为默认值auto，它将占用其余空间

score 0 · Accepted Answer

如果我理解正确...

<div id="left_col">
    Content
</div>
<div id="main">
    Content
</div>

#left_col {
    float: left;
    width: 650px;
}

#main {
    margin-left: 650px;
}

html - css中固定两个左对齐列的最佳方法是什么？