在父级元素中填充背景图片来完美解决DIV高度自适应的问题

       关于DIV高度的自适应，一直是个让人头疼的问题，之前总结过一篇文章在前面：[url=http://www.husw.net/blog/read.php/1055.htm]DIV高度自适应解决方法汇总[/url]，但只是匆匆看了一下，前面的两种方法都试用过，还行吧，但有时也会出意外的情况，归根结底是基础掌握的不好，第三种方法一下没用过，今天又碰到了这个问题，于是好好地研究了一下，终于明白了这第三种方法的好外，就是[b]在父级元素中填充背景[/b]，下面是代码，希望对你的学习也有所帮助。[separator]

HTML代码：
[code]
    <div id="container">
        <div id="leftSide">这边的高度自适应右侧的高度</div>
        <div id="rightSide">
                <script type="text/javascript">
                    for(i=0;i<10;i++){  
                    document.write(i+'<br>');  
                    }  
                </script>
        </div>
    </div>
[/code]

CSS代码：
[code]
    #container{font-size:14px;width:300px;overflow:hidden;border:3px solid gray;margin:10px auto 0;color:#fff;background:url(http://www.husw.net/blog/template/Husw2009/images/panel_bot.gif) repeat-y;}
    #leftSide{width:100px;float:left;}
    #rightSide{width:190px;float:right;text-align:center;background:purple;}
[/code]

[html]



  
  
  
  
  
  



    


[/html]