Question

我正在创建一个非常基本的asp.net网页来显示错误消息。它没有静态页面的功能。我的问题是，中间的警告消息框面板具有最小尺寸以启用正确的自动换行，但是当浏览器调整为小于该面板时，我会在页面侧面获得空白区域。我没有很多关于网站，CSS甚至HTML的知识或经验，所以如果有人能够对这个问题有所了解，那就太棒了：D

我上传了some images，因此您可以看到正常外观是什么以及当我调整浏览器大小并向右滚动时会发生什么。

同样快速记录它发生在我测试过的所有浏览器中（Chrome，IE，Mozilla），所以我相信这是因为我缺乏知识：）

这是我的html / css：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Unauthorised.aspx.cs" Inherits="_Default" %>
<!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>
<style>
html, body {margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding:0; width:100%; height:100%; font-size:100%;}
#BannerImage {position:relative; padding:0; width:100%; height:10%;}
#OuterBackgroundPanel {position:absolute; width:100%; height:90%; z-index:0;}
#InnerBackgroundPanel{position:absolute; top:2%; left:1%; width:98%; height:94%; z-index:1;} 
#MessagePanel {position:absolute; border:3px solid #000000; top:33%; left:33%; width:33%; height:33%; min-height:175px; min-width:425px; max-height:175px; max-width:450px;}
h1 {text-align:center; font-family:Calibri; font-size:2em;}
h2 {text-align:center; font-family:Calibri; font-weight:normal; font-size:1.2em;}
p {text-align:center; font-family:Calibri; font-size:1em;}
</style>
<title>Unauthorised Personnel Warning</title>
</head>
<body>
<div id="Banner">
<asp:Image ID="BannerImage" runat="server" ImageUrl="~/Resources/Gradient Banner.png" />
</div>

<div id="Backgrounds">
<asp:Panel ID="OuterBackgroundPanel" runat="server" BackColor="#D6E8FF">
<asp:Panel ID="InnerBackgroundPanel" runat="server" BackColor="#EBF3FF">
<asp:Panel ID="MessagePanel" runat="server" BackColor="#FFFFFF">
<h1>Title text.</h1>
<h2>Message text.</h2>
<p>Description text.</p>
</asp:Panel>
</asp:Panel>
</asp:Panel>
</div>
</body>
</html>

Answer 1

例如，使用横幅的最小宽度

#Banner{
   min-width:1000px;
}

基本的asp.net网页调整大小问题

1 个答案: