                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /如何用CSS进行网页布局

三列布局用老师的方法实现，为什么中间的div宽度不是自动的？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>新建网页</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<style>
body{
    margin:0px; padding: 0px;
}

#left{  
    width: 300px;
    height:300px;
    position: absolute;
    left: 0; top:0;
    border: 1px solid blue;
}
#mid{
       height:300px;
       width: auto;
       background: green;
       margin:0px 120px;
}
#right{  
    width: 300px;
    height:300px;
    position:absolute;
    right: 0; top:0;
    border:1px solid red;
}
div{ text-align:left; }
</style>
</head>
    <body>
        
          <div id="left">1</div>
          <div  id="mid">2222</div>
          <div  id="right">3</div>
  
    </body>
</html>