I was wondering how I would create multiple columns in a div. It's for a footer and I want a site map, links to social media etc.
我想知道如何在div中创建多个列。这是一个页脚,我想要一个站点地图,社交媒体链接等。
I was going to use <multicol>
but I then read that it was deprecated so it kind of put me off using it.
我打算使用
Basically I have an 80% wide DIV and I need three columns in it. Preferably each with a margin.
基本上我有80%宽的DIV,我需要三列。优选地每个都具有边际。
Css:
CSS:
div.bottom
{
height: 200px;
width: 80%;
margin-left: auto;
margin-right: auto;
margin-top: none;
margin-bottom: none;
border-top: 4px solid #00ccff;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
background-color: #575757;
}
I just need the HTML now. Thank you for your time.
我现在只需要HTML。感谢您的时间。
1 个解决方案
#1
41
Create three divs with float: left;
(or right) and give them an exact width
.
用float:left创建三个div; (或右)并给它们一个确切的宽度。
<div class="bottom">
<div style="float: left; width: 33%;"></div>
<div style="float: left; width: 33%;"></div>
<div style="float: left; width: 33%;"></div>
</div>
See it in action.
看到它在行动。
#1
41
Create three divs with float: left;
(or right) and give them an exact width
.
用float:left创建三个div; (或右)并给它们一个确切的宽度。
<div class="bottom">
<div style="float: left; width: 33%;"></div>
<div style="float: left; width: 33%;"></div>
<div style="float: left; width: 33%;"></div>
</div>
See it in action.
看到它在行动。