无法在 CSS 上左对齐文本

Question

两个框中的文本需要在左侧对齐。但是，即使我将"中心"更改为CSS代码上的"左中心"，也没有任何区别。jsfiddle

    @charset "utf-8";
.box
{
    width: 560px;
    background-color:#CCC;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color:#000;
    text-align:center;
    border: 1px solid #000;
    margin-right:auto;
    margin-left:auto;
    margin-top:15px;
    font-size:24px;
}
.boxbot
{
    width: 560px;
    background-color:#CCC;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    text-align:center;
    border: 1px solid #000;
    margin-right:auto;
    margin-left:auto;
    margin-top:3px;
    font-size:16px;
}
.boxyoutube
{
    width: 560px;
    height: 345px;
    background-color:#CCC;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    text-align:center;
    border: 1px solid #000;
    margin-right:auto;
    margin-left:auto;
    margin-top:3px;
    font-size:16px;
}
.boxbot2
{
    width: 560px;
    background-color:#CCC;
    text-align:center;
    border: 1px solid #000;
    margin-right:auto;
    margin-left:auto;
    margin-top:3px;
    font-size:16px;
}
.submit
{
    width: 560px;
    background-color:#CCC;
    text-align:left;
    border: 1px solid #000;
    margin-right:auto;
    margin-left:auto;
    margin-top:3px;
    font-size:16px;
}
body
{
    alignment-adjust:central;
    background-color:#CCC;
}
select{
    width:auto;}
#wrapper
{
    text-align:center;
}

Answer 1

您需要从这两个类#wrapper和.boxbot2

中删除对齐方式

#wrapper
{
    text-align:center; -- remove it
}
.boxbot2
{
    width: 560px;
    background-color:#CCC;
    text-align:center;  -- remove it
    border: 1px solid #000;
    margin-right:auto;
    margin-left:auto;
    margin-top:3px;
    font-size:16px;
}

Js小提琴演示

Answer 2

看来，您的#wrapper中的text-align声明已将center

设置为

检查一下：http：//jsfiddle.net/3d8tq/1/

我刚从包装器中删除了text-align，似乎工作正常