Html 将CSS元素与设置的宽度对齐_Html_Css_Alignment

Html 将CSS元素与设置的宽度对齐

html css

Html 将CSS元素与设置的宽度对齐,html,css,alignment,Html,Css,Alignment,我有一个CSS元素，应该是1000像素的固定宽度。以下是我的CSS代码： #content { margin:auto; background-color:#DDDDDD; position:absolute; top:110px; width:1000px; } 它完美地设置了宽度、位置和颜色，但始终与左侧对齐。我希望整个文本块与中心对齐。我试着用HTML来做这件事： <div id="content" align="center"> So

我有一个CSS元素，应该是1000像素的固定宽度。以下是我的CSS代码：

#content
{
    margin:auto;
    background-color:#DDDDDD;
    position:absolute;
    top:110px;
    width:1000px;
}

它完美地设置了宽度、位置和颜色，但始终与左侧对齐。我希望整个文本块与中心对齐。我试着用HTML来做这件事：

<div id="content" align="center">
Some test content
</div>


一些测试内容

但是，这只会对齐元素内部的文本，而不会对齐元素本身。下面是它的样子：

非常感谢您为使其与中心对齐所提供的任何帮助。提前谢谢

移除

位置：绝对以使其水平居中
我看不到你的html结构。如果您的垂直位置受此影响，请尝试将margin:auto
更改为：
margin:110px自动0
或边距：0 auto
如果要将元素从绝对位置居中，此元素仍应处于静态上下文中。
例：
您应该使用css将div
居中
大概是这样的：
#content
{
background-color:#DDDDDD;
width:1000px;
margin: 110px auto; /*center the element and set top margin to 110px*/
}

<div id="content">
Some test content
</div>

#内容
{
背景色：#DDDDDD；
宽度：1000px；
边距：110px自动；/*将元素居中，并将顶部边距设置为110px*/
}
一些测试内容

#内容{
背景色：#DDDDDD；
宽度：1000px；
保证金：0自动；
}
#包装纸{
宽度：1300px；
}
一些测试内容
我正在尝试将其居中horizontally@RyanSparks我知道，我是无意中垂直打字的！哦，谢谢！我将其更改为相对，但它将其垂直和水平对齐，而我只希望它水平对齐…@RyanSparks然后使用margin:0 auto
而不是margin:auto
margin:0 auto不执行任何边距：自动的操作尚未执行
#content
{
background-color:#DDDDDD;
width:1000px;
margin: 110px auto; /*center the element and set top margin to 110px*/
}

<div id="content">
Some test content
</div>

<!DOCTYPE>
<html>
    <head>
        <style>
            #content{
                background-color:#DDDDDD;
                width:1000px;
            margin: 0 auto;
            }
            #wrapper{
            width: 1300px;
            }
        </style>
    </head>
    <body>
        <div id="wrapper">
            <div id="content" align="center">Some test content</div>
        </div>
    </body>
</html>