Html 如何使此css自动适应屏幕

我下载了一个模板用于我的主页，但它并没有像我预期的那样填充整个屏幕。页面在屏幕区域的右上方，如屏幕截图所示。我已经找到了一些解决方案，但没有成功，例如

<meta name=”viewport” content=”width=device-width, initial-scale=1″ /><!--Added2017-4-28-->
<!–[if lt IE 9]><script src=”http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js”></script><![endif]–><!--Added2017-4-28-->

解决方案：真巴别塔：假-->

/*
模板名称：教育委员会
文件：布局CSS
作者：操作系统模板
作者URI：http://www.cssmoban.com/
许可证：
*/
@导入url（navi.css）；
@导入url（forms.css）；
@导入url（tables.css）；
@导入url（homepage.css）；
@导入url（gallery.css）；
@导入url（portfolio.css）；
@导入url（特色幻灯片.css）；
身体{
字体：普通100%Helvetica，Arial，无衬线；
}
身体{
保证金：0；
填充：0；
字号：1em；
字体系列：佐治亚州，“泰晤士报新罗马”，泰晤士报，衬线；
颜色：#979797；
背景色：#333333；
}
.main{float:right；width:auto；}
.leftBar{float:left；width:auto%；}
img{margin:0；padding:0；border:none；}
.justify{text align:justify；}
.bold{font-weight:bold；}
.center{text align:center；}
.right{text align:right；}
.nostart{列表样式类型：无；边距：0；填充：0；}
.clear:在{content:“.”之后显示：块；高度：0；清除：两者；可见性：隐藏；线高度：0；}
.clear{显示：内联块；}
html[xmlns]。清除{display:block；}
*html.clear{高度：1%；}
{大纲：无；文本装饰：无；}
.fl_left{float:left；}
.fl_right{float:right；}
.imgholder、.imgl、.imgr{填充：4px；边框：1px实心#D8D8D8；文本对齐：中心；}
.imgl{浮点：左；边距：0 15px 15px 0；清除：左；}
.imgr{浮点：右；边距：0 0 15px 15px；清除：右；}
/*第三十四天——包装-------------------------------------*/
分区包装器{
显示：块；
宽度：100%；
文本对齐：左对齐；
}
分区包装h1、分区包装h2、分区包装h3、分区包装h4、分区包装h5、分区包装h6{
利润率：0.15px0；
填充：0；
字体大小：16px；
字体大小：正常；
字体：斜体；
线高：正常；
颜色：#333333；
背景色：透明；
}
.row1、.row2{颜色：#979797；背景色：#E1D6CB；}
.row3{color:#979797；背景色：#FFFFFF；边框顶部：1px实心#510000；边框底部：5px实心#E1D6CB；}
.row3 a{color:#896C50；背景色：#FFFFFF；}
.row4{填充：30px 0；}
/*第三十四条概括-------------------------------------*/
#页眉、#容器、#页脚、#版权所有{
位置：相对位置；
保证金：0自动0；
显示：块；
宽度：960px；
}
/*-------------------------------------标题-------------------------------------*/
#标头{填充：25px 0 30px 0；}
#收割台h1、#收割台p、#收割台ul{
保证金：0；
填充：0；
列表样式：无；
线高：正常；
}
#页眉h1{字体大小：26px；字体变体：小大写；字体样式：普通；}
#标题h1a{color:#333333；背景色：#E1D6CB；}
#标题p{字体大小：12px；}
#标题PA{颜色：#510000；背景颜色：#E1D6CB；}
#header.fl#u left，#header.fl_right{页边距底部：15px；}
#header.fl_right{margin top:13px；}
#header.flu right p{float:left；margin:5px50px0；}
/*第三十四条内容-------------------------------------*/
#容器{填充：30px 0；线高度：1.6em；}
#集装箱h1、#集装箱h2、#集装箱h3、#集装箱h4、#集装箱h5、#集装箱h6{
背景色：#FFFFFF；
利润率：0.15px0；
填充：0 10px 0；
边框底部：1px实心#d8d8；
}
#容器。阅读更多{
显示：块；
宽度：100%；
文本对齐：右对齐；
线高：正常；
}
#内容{
显示：块；
浮动：左；
宽度：630px；
}
/*----评论-----*/
#注释{页边距底部：40px；}
#comments.commentlist{margin:0；padding:0；}
#commentlist ul{margin:0；padding:0；列表样式：none；}
#comments.commentlist li.comments_odd，#comments.commentlist li.comments_偶数{边距：0 0 10px 0；填充：15px；列表样式：无；}
#comments.commentlist li.comment_odd{color:#666666；背景色：#F7F7F7F7；}
#comments.commentlist li.comment_odd a{color:#896C50；背景色：#F7F7F7F7；}
#comments.commentlist li.comment_偶数{颜色：#666666；背景色：#E8E8E8；}
#comments.commentlist li.comment_偶数a{color:#896C50；背景色：#E8E8E8；}
#comments.commentlist.author.name{font-weight:bold；}
#comments.commentlist.submitdate{font size:small；}
#comments.commentlist p{margin:10px 5px 10px 0；padding:0；字体重量：正常；文本转换：无；}
#comments.commentlist li.avatar{float:right；border:1px solid#EEEEEE；margin:010px；}
/*第三十四天——专栏-------------------------------------*/
#纵队{
显示：块；
浮动：对；
宽度：300px；
}
#列。保持架，#列#特色{
显示：块；
宽度：300px；
边缘底部：30px；
}
#列.持有人h2.标题{
显示：块；
宽度：100%；
高度：65px；
保证金：0；
填充：15px0；
字体大小：20px；
文本转换：无；
线高：正常；
边框底部：1px点#999999；
}
#柱.支架h2.标题img{
浮动：左；
利润率：-15px 8px 0；
填充物：5px；
边框：1px实心#999999；
}
#列div.imgholder{
显示：块；
宽度：290px；
裕度：0 10px 0；
}
#列持有人p.readmore{
显示：块；
宽度：100%；
字体大小：粗体；
文本对齐：右对齐；
线高：正常；
}
/*特色街区*/
#专栏#特色ul，#专栏#特色h2，#专栏#特色p{
保证金：0；
填充：0；
列表样式：无；
颜色：#666666；
背景色：#F7F7F7；
}
#专栏#以{
颜色：#896C50；
背景色：#F7F7F7；
}
#专栏#精选李{
显示：块；
宽度：250px；
保证金：0；
填充：20px 25px；
颜色：#666666；
背景色：#F7F7F7；
}
#专栏#精选李p.imgholder{
显示：块；
宽度：240px；
高度：90px；
利润率：20px 0 15px 0；
.wrapper {
  margin: 0 auto;
  max-width: 1200px;
}