HTML&；CSS：为什么我不能在我已经使用边距0的部分中居中并将其设置为'；宽度是多少？

这是我的html代码

<section id="usercontent">
        <h1>Section - User Content</h1>
            <article id="notifications">
                <h1>Notifications</h1>
                <p>Why I can't center this? I already use margin:0 auto;</p>
            </article>
        <article>
            <h1>Article - Left Content</h1>
                <section id="menuform">
                    <h1>User Menus</h1>
                </section>
                <section id="shareform">
                    <h1>Shout to the world</h1>
                    <form method="post">
                    <table>
                        <tr>
                            <td>Shout to the world:</td>
                        </tr>
                        <tr>
                            <td><textarea name="user_post" required="required"></textarea></td>
                        </tr>
                        <tr>
                            <td><input id="btn_share" type="submit" value="Share" name="share"></td>
                        </tr>
                    </table>
                    </form>
                    <?php
                    if(isset($_POST['share'])){

                    }
                    ?>
                </section>
        </article>
        <aside>
            <h1>Aside - Right Content</h1>
        </aside>
        <div id="clearfloats"></div>
    </section>

输出

---

我在这一部分遇到了问题#用户内容文章#通知我不知道如何使它成为中心我已经使用边距：0自动；需要建议来解决这个问题，谢谢

您正在使用float:left；关于文章。加浮点数：无；“section#usercontent article#notifications”或从“section#usercontent article”中删除左浮动。

您使用的是浮动：左；关于文章。加浮点数：无；要“section#usercontent article#notifications”或从“section#usercontent article”中删除左浮动，您可以尝试以下操作：

HTML

您可以尝试以下方法：

<section id="usercontent">
        <h1>Section - User Content</h1>
            <article id="notifications">
                <span>Notifications</span>
                <p>Why I can't center this? I already use margin:0 auto;</p>
            </article>
        <article>
            <h1>Article - Left Content</h1>
                <section id="menuform">
                    <h1>User Menus</h1>
                </section>
                <section id="shareform">
                    <h1>Shout to the world</h1>
                    <form method="post">
                    <table>
                        <tr>
                            <td>Shout to the world:</td>
                        </tr>
                        <tr>
                            <td><textarea name="user_post" required="required"></textarea></td>
                        </tr>
                        <tr>
                            <td><input id="btn_share" type="submit" value="Share" name="share"></td>
                        </tr>
                    </table>
                    </form>
                    <?php
                    if(isset($_POST['share'])){

                    }
                    ?>
                </section>
        </article>
        <aside>
            <h1>Aside - Right Content</h1>
        </aside>
        <div id="clearfloats"></div>
    </section>

section#usercontent {
    width:600px;
    background-image:url('../img/content.png');
    font-size:13px;
    color:#323232;
}
section#usercontent h1 {
    visibility:hidden;
    position:absolute;
}

/*clear floats*/

section#usercontent div#clearfloats {
    clear:both;
}

section#usercontent article#notifications {
    width:500px;
    height:40px;
    text-align:center;
}

/*article styles*/

section#usercontent article {
    width:220px;
    margin-left:30px;
}
section#usercontent article section#menuform {
    border:1px solid black;
    height:50px;
}
section#usercontent article section#shareform {
    border:1px solid black;
}
section#usercontent article section#shareform table {
    margin:0 auto;
    margin-bottom:8px;
    margin-top:8px;
}
section#usercontent article section#shareform table td {
    padding:2px;
}
section#usercontent article section#shareform input#btn_share {
    border:1px solid #E0BE47;
    border-radius:8px;
    width:58px;height:20px;
    background-color:#FAF5CE;
    cursor:pointer;
    font-size:12px;
    color:#323232;
    float:right;
}
section#usercontent textarea {
    height:55px;
}

/*aside styles*/

section#usercontent aside {
    width:340px;
    float:right;
    margin-right:10px;
}
section#usercontent aside, section#usercontent article {
    margin-top:10px;
    margin-bottom:10px;
    border:1px solid #E0BE47;
    border-radius:8px;
}

HTML

---

@Sui-Go代码是否正常工作？如果需要修改，请通知。@Sui Go代码正常吗？如需修改，请告知。

<section id="usercontent">
        <h1>Section - User Content</h1>
            <article id="notifications">
                <span>Notifications</span>
                <p>Why I can't center this? I already use margin:0 auto;</p>
            </article>
        <article>
            <h1>Article - Left Content</h1>
                <section id="menuform">
                    <h1>User Menus</h1>
                </section>
                <section id="shareform">
                    <h1>Shout to the world</h1>
                    <form method="post">
                    <table>
                        <tr>
                            <td>Shout to the world:</td>
                        </tr>
                        <tr>
                            <td><textarea name="user_post" required="required"></textarea></td>
                        </tr>
                        <tr>
                            <td><input id="btn_share" type="submit" value="Share" name="share"></td>
                        </tr>
                    </table>
                    </form>
                    <?php
                    if(isset($_POST['share'])){

                    }
                    ?>
                </section>
        </article>
        <aside>
            <h1>Aside - Right Content</h1>
        </aside>
        <div id="clearfloats"></div>
    </section>

section#usercontent {
    width:600px;
    background-image:url('../img/content.png');
    font-size:13px;
    color:#323232;
}
section#usercontent h1 {
    visibility:hidden;
    position:absolute;
}

/*clear floats*/

section#usercontent div#clearfloats {
    clear:both;
}

section#usercontent article#notifications {
    width:500px;
    height:40px;
    text-align:center;
}

/*article styles*/

section#usercontent article {
    width:220px;
    margin-left:30px;
}
section#usercontent article section#menuform {
    border:1px solid black;
    height:50px;
}
section#usercontent article section#shareform {
    border:1px solid black;
}
section#usercontent article section#shareform table {
    margin:0 auto;
    margin-bottom:8px;
    margin-top:8px;
}
section#usercontent article section#shareform table td {
    padding:2px;
}
section#usercontent article section#shareform input#btn_share {
    border:1px solid #E0BE47;
    border-radius:8px;
    width:58px;height:20px;
    background-color:#FAF5CE;
    cursor:pointer;
    font-size:12px;
    color:#323232;
    float:right;
}
section#usercontent textarea {
    height:55px;
}

/*aside styles*/

section#usercontent aside {
    width:340px;
    float:right;
    margin-right:10px;
}
section#usercontent aside, section#usercontent article {
    margin-top:10px;
    margin-bottom:10px;
    border:1px solid #E0BE47;
    border-radius:8px;
}