两列宽度为50％css [英] Two column width 50% css

问题描述

我想使用DIV制作两列布局，其中右列将具有50％的宽度，而左列将占用50％。
我该怎么做？

解决方案

演示
html

 < div class =div1> Left div< / div> 
< div class =div2>正确的div< / div> 
  

css

  body，html {
 width：100％; 
身高：100％; 
保证金：0; 
 padding：0; 
} 
 .div1 {
 width：50％; 
 float：left; 
背景：#ccc; 
身高：100％; 
} 
 .div2 {
 width：50％; 
 float：right; 
背景：#aaa; 
身高：100％; 
} 
  

I want to make a two column layout using DIVs, where right column will have 50% width and the left one would take 50% too. How can I do that?

解决方案

Demo

html

<div class="div1">Left div</div>
<div class="div2">Right div</div>

css

body, html {
    width: 100%;
    height: 100%;
    margin:0;
    padding:0;
}
.div1 {
    width: 50%;
    float: left;
    background: #ccc;
    height: 100%;
}
.div2 {
    width: 50%;
    float: right;
    background: #aaa;
    height: 100%;
}

这篇关于两列宽度为50％css的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！