问一个css问题

Question

<div class="a1">
   <div class="a11"></div>
   <div class="a12"></div>
</div>
-------------
.a1{width:100%;height:100%;}
.a11{width:200px;height:100%;float:left;}
.a12{width:100%;height:100%;float:left;}
//这个样式我是这样写的，
意思是a1随屏幕的大小自动扩展；
现在我必须让左侧a11为200px,而右侧a12为自动扩展。
不知样式如何改写？

Answer 1

这个硬要用div的确很伤脑筋,
但用table轻而易举!

Answer 2

我觉得你还是用table比较好。

Answer 3

你这样设置，a12只会浮动到a11下面，因为a12为1width:100%
你不妨加一个具体的width值，因为任何一个网页总会有一个宽度的
<div class="a1">
    <div class="a">
       <div class="a11"></div>
       <div class="a12"></div>
    </div>
</div>
-------------
.a1{width:100%;height:100%;}
.a{width:850px;}
.a11{width:200px;height:100%;float:left;}
.a12{width:650px;height:100%;float:left;}
希望可以帮到你

Answer 4

不可以 height:100% 会失效  只能auto 或者明确定义高度大小
如果这样写 你的a11和al2也不可能一个居左一个居右
它俩一共width最大100%已经超出范围了

Answer 5

注意下 浏览器的兼容性 height

Answer 6

.a12{width:100%;height:100%;margin-left:200px;float:left;}

Answer 7

.a1{width:100%;height:auto;}
.a11{width:20%;height:auto;background-color:#CCCCFF;float:left;}
.a12{width:80%;height:auto;background-color:#ff0000;float:left;}
================
如果这样写，就好多了，但我想要实现.a11{width:200px;} 
真的没有办法？

Answer 8

<div class="a1">
  <div class="a11"></div>
  <div class="a12"></div>
</div>.a1{width:100%;height:100%;position:relative;}
.a11{width:200px;height:100%;position:absolute;top:0px;left:0px;}
.a12{height:100%;margin-left:200px;}试下这个  我机子上可以。。

Answer 9

.a1{width:100%; height:auto;}
.a11{width:200px; height:auto;float:left;}
.a12{width:auto; height:auto;}这样应该可以，我试了下

Answer 10

  <div class="a1">
    <div class="a11"></div>
    <div class="a12"></div>
  </div>.a12{width:auto; height:auto; float:left;}不好意思，a12 里少写了一个 float:left;