如何创建只有CSS的3栏布局？
如何创建只有CSS的3栏布局？
提问于 2012-01-24 13:34:07
我正在尝试纠正一个问题，页面的content部分有三列，但DIVs没有相应地浮动。这是我的HTML：
<div id="content">
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="columns">
<div id="borrower">
</div>
<div id="dealer">
</div>
<div id="investor">
</div>
</div>
<div class="footer">
</div>这是我的CSS：
body{
font-family:Verdana, Geneva, sans-serif;
font-size: 10px;
width:100%;
height: 100%;
}
#content
{
background-image: url('../Images/background_03.jpg');
background-repeat: no-repeat;
width: 1150px;
height: 399px;
}
#borrower
{
background-image: url('../Images/Borrower.jpg');
background-repeat: no-repeat;
width: 371px;
height: 248px;
float: left;
}
#investor
{
background-image: url('../Images/Lender.jpg');
background-repeat: no-repeat;
width: 371px;
height: 248px;
}
#dealer
{
background-image: url('../Images/dealer.jpg');
background-repeat: no-repeat;
width: 371px;
height:248px;
float: right;
}
#footer
{
clear:both;
}使用上面的代码，贷款人DIV直接位于借款人DIV的下面，而不是坐在借款人和交易商之间的中间。我该如何纠正这个问题呢？
Stack Overflow用户
发布于 2012-01-24 13:57:36
请在您的投资者id中添加"float:left;“。css是
#investor
{
background-image: url('../Images/Lender.jpg');
background-repeat: no-repeat;
width: 371px;
height: 248px; float:left;
}谢谢
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8982446
复制相关文章
相似问题
腾讯云开发者
