好吧问答库 > div 设置100%宽（共两层，top层和main层），下面层设置固定宽居中，全屏显示正常，窗口化，右侧有空白？

div 设置100%宽（共两层，top层和main层），下面层设置固定宽居中，全屏显示正常，窗口化，右侧有空白？

html代码<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %><!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 runat="server"> <title>无标题页</title> <style type="text/css"> html, body { margin: 0px; padding: 0px; } .top { height: 100px; background-color: Olive; width: 100%; } .main { width: 900px; height: 500px; margin: 0px auto; background-color: Silver; } </style></head><body style="margin: 0px; padding: 0px;"> <form id="form1" runat="server"> <div class="top"> </div> <div class="main"> </div> </form></body></html>-----------------------------------------------------------------------------------在浏览器窗口化而且窗口的大小比main层小的时候，拖动横向滚动条，top层右侧有空白？求帮助！

2026年09月28日 10:00

有2个网友回答

网友（1）：

我只能说这似乎是个很正常的问题，所有浏览器的排版标准都是全屏浏览的状态下的：窗口化之后页面左右宽度是会自动改变的，里面的div是不太可能对齐，不然你可以试下其他的大网站。

网友（2）：

这显示是对的.因为你CSS就是这样定义的...
top的宽度是100%,也就是相当于浏览器窗口的宽度,浏览器在窗口模式下,宽度小于900px..main的宽度是固定值且大于浏览器窗口宽度,自然会出现滚动条,拉动滚动条时top的右边就是空白了

假如浏览器窗口宽度是500px,那top的宽度也是500px,你让它怎么和宽度是900px的main对齐??

在.top的样式里加上这个试试: min-width:900px;