关于浏览器大小改变div布局的问题


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
</head>
<body>
<div style="width:400px;height:25px;background-color:Green"></div>
<div style="width:200px;height:40px;float:left;background-color:Navy"></div>
<div style="width:200px;height:40px;background-color:Red;float:left;"></div>
</body>
</html>上面是代码
这个是正常布局这个是我把浏览器宽度调小了，布局就变了

解决方案 »

  1.   

    <div style="width:410px;margin:0 auto;">
    <div style="width:100%;height:25px;background-color:Green"></div>
    <div style="width:50%;height:40px;float:left;background-color:Navy"></div>
    <div style="width:50%;height:40px;background-color:Red;float:left;"></div>
    <div>
      

  2.   

    谢谢  楼上的 ，  你用的是百分比来控制宽度  ， 但是我想要用像素值来控制  ，好像还是不行，请问有其他方法吗，其实我要做的东西，顶部是logo，下面左边是树形结构，右边是正文，有百分比好像行不通
      

  3.   

    那就使用JS，先用JS获得浏览器的高度和宽度，然后使用JS获得每一个图层，再去根据你想要的百分比*高度或者宽度，然后调整你需要调整的DIV就可以了
      

  4.   

    这是JS获得浏览器宽度和高度的方法
    http://apps.hi.baidu.com/share/detail/15339470
    至于使用JS操作DIV的宽度和高度，不需要给你贴代码了吧？