以px和百分比的宽度浮动两个DIV

Goo*_*bot 2 html css css3 css-float

如何将float两个DIVs并排,因为一个的宽度在像素中定义,另一个应该填充父级中的可用宽度DIV?关键是第二个内容DIV可能是空白的; 因此,我不能把它的宽度留空.

.div1 {
float:left;
display:block;
width:200px
}

.div2 {
float:left;
display:block;
width: [... 100% - 200px ...]
} 
Run Code Online (Sandbox Code Playgroud)

eas*_*wee 6

简单 - 浮动第一个div并且只给第一个div宽度的边距到第二个div(div是一个块元素,因此它已经有100%的宽度 - 只是为了验证你可以添加width:auto):

.div1 {
  float: left;
  width: 200px;
  height: 100px;
  background: violet;
}

.div2 {
  width: auto;
  margin-left: 200px;    
  height: 100px;
  background: yellow;    
}
Run Code Online (Sandbox Code Playgroud)

这里有一个小提琴:http://jsfiddle.net/gFyY3/