Html 为什么不能将div content设置为center？_Html_Css

Html 为什么不能将div content设置为center？

html css

Html 为什么不能将div content设置为center？,html,css,Html,Css,我有一个web图表组件，我想显示浏览器的中心，这个html代码： <div class='center1'> <dxchartsui:WebChartControl ID="WebChartControl1" runat="server" CrosshairEnabled="True" Height="500px" Width="500px" AppearanceNameSerializable="Dark"> </

我有一个web图表组件，我想显示浏览器的中心，这个html代码：

<div class='center1'>

            <dxchartsui:WebChartControl ID="WebChartControl1" runat="server" CrosshairEnabled="True" Height="500px" Width="500px" AppearanceNameSerializable="Dark">
            </dxchartsui:WebChartControl>

        </div>

但在运行网页时显示此信息：

我怎样才能解决这个问题

我的完整网页html:

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

<%@ Register assembly="DevExpress.XtraCharts.v15.1.Web, Version=15.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.XtraCharts.Web" tagprefix="dxchartsui" %>
<%@ Register assembly="DevExpress.XtraCharts.v15.1.Web, Version=15.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.XtraCharts.Web.Designer" tagprefix="dxchartdesigner" %>
<%@ Register assembly="DevExpress.XtraCharts.v15.1, Version=15.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.XtraCharts" tagprefix="cc1" %>

<%@ Register assembly="DevExpress.XtraReports.v15.1.Web, Version=15.1.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.XtraReports.Web" tagprefix="dx" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="js/vendor/modernizr-2.6.2.min.js"></script>
    <link href="css/main.css" rel="stylesheet" />
    <link href="css/normalize.css" rel="stylesheet" />

    <style>
        .center {

            width:800px;
            border-radius: 5px;

            width: 60%; 
            height:200px; 
            margin: 0 auto;
            text-align: center;
        }
         .center1 {

            width:800px;
            border-radius: 5px;

            width: 60%; 
            height:200px; 
            margin: 0 auto;
            text-align: center;

        }
    </style>


    <style type="text/css">
    .back-link a {
        color: #4ca340;
        text-decoration: none; 
        border-bottom: 1px #4ca340 solid;
    }
    .back-link a:hover,
    .back-link a:focus {
        color: #408536; 
        text-decoration: none;
        border-bottom: 1px #408536 solid;
    }
    h1 {
        height: 100%;
        /* The html and body elements cannot have any padding or margin. */
        margin: 0;
        font-size: 14px;
        font-family: 'Open Sans', sans-serif;
        font-size: 32px;
        margin-bottom: 3px;
    }
    .entry-header {
        text-align: left;
        margin: 0 auto 50px auto;
        width: 80%;
        max-width: 978px;
        position: relative;
        z-index: 10001;
    }
    #democontent {
        padding-top: 100px;
    }
        .center1 {
        }
    </style>

</head>
<body style="background-color:#5bb4cc">
    <form id="form1" runat="server">


    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script>
    <script src="js/main.js"></script>


    <div class='center'>

        <br />
        <br />
        <asp:DropDownList ID="DropDownList1" runat="server">
        </asp:DropDownList>
                    <br />
        <br />


                    <asp:Button ID="Button1" runat="server" Font-Bold="True" Font-Size="Medium" Height="46px" OnClick="Button1_Click" Text="شروع کن" Width="194px" />


        <br />



    </div>
        <br />
        <br />

    <div class='center1'>

        <dxchartsui:WebChartControl ID="WebChartControl1" runat="server" CrosshairEnabled="True" Height="500px" Width="685px" AppearanceNameSerializable="Dark" PaletteName="Default" style="text-align: center">
        </dxchartsui:WebChartControl>

     </div>
    </form>
</body>
</html>


.中心{
宽度：800px；
边界半径：5px；
宽度：60%；
高度：200px；
保证金：0自动；
文本对齐：居中；
}
.center1{
宽度：800px；
边界半径：5px；
宽度：60%；
高度：200px；
保证金：0自动；
文本对齐：居中；
}
.反向链接a{
颜色：#4ca340；
文字装饰：无；
边框底部：1px#4ca340实心；
}
.反向链接a：悬停，
.反向链接a：焦点{
颜色：#408536；
文字装饰：无；
边框底部：1px#408536实心；
}
h1{
身高：100%；
/*html和body元素不能有任何填充或边距*/
保证金：0；
字体大小：14px；
字体系列：“开放式Sans”，无衬线；
字体大小：32px；
利润底部：3倍；
}
.分录标题{
文本对齐：左对齐；
保证金：0自动50px自动；
宽度：80%；
最大宽度：978px；
位置：相对位置；
z指数：10001；
}
#人口内容{
填充顶部：100px；
}
.center1{
}
window.jQuery | | document.write（“”）

您应该尝试使用如下中心标记：

<center>
    <div class="center1">
        <dxchartsui:WebChartControl ID="WebChartControl1" runat="server" CrosshairEnabled="True" Height="500px" Width="500px" AppearanceNameSerializable="Dark">
        </dxchartsui:WebChartControl>
    </div>
</center>

希望这有帮助

尝试将

text align:center

添加到代码中的

#form1

的父级

.center1

。因此，在css中添加此规则：

body {text-align:center;}
#form1{text-align:center;}

并删除空规则：

.center1{
}

它是否继承了任何其他样式规则的

float

？能否显示页面的其余HTML标记？@afelixj请稍候。@ryandonohue请等待为什么要使用

width

两次

已弃用您应该为此使用css我知道它已弃用，但我的朋友还能用多久？“已弃用此功能已从Web标准中删除。尽管某些浏览器可能仍支持此功能，但它正在被删除。请勿在旧项目或新项目中使用此功能。使用此功能的网页或Web应用程序可能随时中断。”您是否复制并粘贴了此功能？有

“

在它周围，所以它可能是一个引文是的。。。顺便说一句，它现在实际上是HTML-5

body {text-align:center;}
#form1{text-align:center;}