非高手，不要进来（css难题）

<html>
<style type="text/css">
.outer{
position:static;
background-color:black;
}
.content{
height:200px;
background-color:red;}
.pic{
position:absolute;
/*
pic.jpg: 1px height,20px width
*/background:url("pic.jpg") repeat-y ;
height:100%;
width:200px;
right:-20px;margin:0px;
top:0px;
padding-bottom:100%;}</style><div class="toplevel" style="position:absolute;background-color:blue"><div class="outer">
<div class="content">hello,world</div>
<div id="test" class="pic"></div>
</div><div>bottom of pic</div>
<div>bottom of pic</div>
<div>bottom of pic</div>
<div>bottom of pic</div>
</div><html> 使用ie6运行上面的程序。你会看到pic的高度有点不正常。我希望pic的高度与红色区域的高度一致。你可以，且只能修改.pic的css来达到这个目的。要求不能使用javascript，不能出现绝对值。

解决方案 »

  1.   

    补充一点：.pic中的position,background的图片和repeat属性不能改。其他都可以
      

  2.   

    也可以这么说：
    <html>
    <style type="text/css">
    .outer{
    position:static;
    background-color:black;
    }
    .content{
    height:200px;
    background-color:red;
    } .pic{
    position:absolute;
    /*
    pic.jpg: 1px height,20px width
    */background:url("pic.jpg") repeat-y ;
    height:100%;
    width:200px;
    right:-20px;
    margin:0px;
    top:0px;
    /*padding-bottom:100%;*/} </style><div class="toplevel" style="position:absolute;background-color:blue"><div class="outer">
    <div class="content">hello,world</div>
    <div id="test" class="pic"></div>
    </div><div>bottom of pic</div>
    <div>bottom of pic</div>
    <div>bottom of pic</div>
    <div>bottom of pic</div>
    </div> </html>
    请在ie6中运行上面这个程序。你会发现test的div高度很不正常。 我的期望是它与outer的高度一致。在这里看上去的效果应该是与红色区域高度一致。 这个目的很easy。但是，要求如下：第一，只允许修改.pic的css。且不能改动其中的：position。不能修改background:url("pic.jpg") repeat-y ;pic.jpg是x*1的。第二，不能出现绝对值，height:200px这样是行第三，不能使用javascript,不可以出现expression。所实习公司ibm身边的几个regular,都不会。于是他们不管了，让我一个人研究。我只想知道：理论上可行吗？？？
      

  3.   

    这个问题我以前也遇到过,就是左右两个DIV高度自适应,后来百度了很久,得出结论是不行的,不过可以用一些变通的方式,不过这些变通的方法也不适合你的绝对定位方式
      

  4.   

    这个问题的难度就在于这几个不可少的条件。这不是产品本身，只是一个等价的测试小程序。这些条件是使得其它部分正常工作的必要前提。不过对于position: 你可以改成relative。但是改了后，要加另一个条件： pic必须位于test外面。且与其等高
      

  5.   

    此回复为自动发出,仅用于显示而已，并无任何其他特殊作用
    楼主【hsduren】截止到2008-07-19 17:16:05的历史汇总数据(不包括此帖)：
    发帖的总数量:0                        发帖的总分数:0                        每贴平均分数:0                        
    回帖的总数量:1                        得分贴总数量:0                        回帖的得分率:0%                       
    结贴的总数量:0                        结贴的总分数:0                        
    无满意结贴数:0                        无满意结贴分:0                        
    未结的帖子数:0                        未结的总分数:0                        
    结贴的百分比:---------------------结分的百分比:---------------------
    无满意结贴率:---------------------无满意结分率:---------------------
    如何结贴请参考这里：http://topic.csdn.net/u/20080501/09/ef7ba1b3-6466-49f6-9d92-36fe6d471dd1.html
      

  6.   

    只能js或者在pic中height:100%试一下。
      

  7.   

    .outer{ 
    position:static; 
    background-color:black; 
    height:100%;//使用相对高度,加上这一句就可以了}
      

  8.   

    不能修改outer的。只能修改.pic