ASP.net - 中心对齐面板？答案

【问题标题】：ASP.net - Center Align Panel?ASP.net - 中心对齐面板？
【发布时间】：2012-07-20 16:31:31
【问题描述】：

我需要居中对齐面板。我使用以下内容：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestDefault.aspx.cs" Inherits="tregware.TestDefault" %>

<!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>
</head>
<body>
<form id="form1" runat="server">
<asp:Panel ID="Root" runat="server" BackColor="Red"  HorizontalAlign="Center" Style="left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 0;">


<asp:Panel ID="Body" runat="server" BackColor="Blue" 
    Style="left: 0px; top: 24px;width: 800px; height: 100%; position: absolute; z-index: 0;" 
    HorizontalAlign="Center">
</asp:Panel>

</asp:Panel>
</form>
</body>
</html>

但是面板（“Body”）不会居中。我该怎么做？

【问题讨论】：

标签： asp.net html alignment panel center

【解决方案1】：

你已经设置了position: absolute，所以很多你用来居中元素的常规方法可能都行不通了。

由于您已设置固定的width 或800px，您可以使用：

Style="left: 50%; margin-left: -400px; ..."

【讨论】：

【解决方案2】：

面板具有 HorizontalAlign

的属性

<asp:Panel id="reqId" runat="server" HorizontalAlign="center" >
Your Text Here
</asp:Panel>

【讨论】：

【解决方案3】：

创建一个名为.panel { align:center }的css

然后将其添加到面板CssClass = "panel"

【讨论】：