3

WebサイトをHTML5に書き直していますが、フッターのコンテンツを中央に配置する際に問題が発生しています。

私のフッターHTMLはとてもシンプルです

<footer> Copyright </footer>

そしてcssは

footer {
    margin: auto;
    height: 330px;
    background-color: #1e2127;
    color: #ffffff;
}

ただし、コンテンツはページの残りの部分の中央に配置されていません。

私は何が欠けていますか？

編集：
フッター内のテキストを中央に配置するのではなく、フッター自体だけを中央に配置します（したがって、ページの残りの部分と整列します）が、背景をページ全体に塗りつぶします。

4

6 に答える 6

3

フッターに幅を指定していません。つまり、デフォルトで100％になり、テキストは左揃えになります。text-alignを追加：テキストを中央に配置するために中央に配置するか、フッター全体を中央に配置するために幅を追加します。

于 2012-08-23T12:28:27.127 に答える
3

これがあなたが望むものであることを願っていますデモ

footer {
    margin: auto;
    height: 330px;
    background-color: #1e2127;
    color: #ffffff;
    text-align:center; //to align the text in center
}​
于 2012-08-23T12:26:49.003 に答える
3

フッターを水平方向に中央揃えにする必要があると仮定します。この場合、自動的に中央揃えにmargin: auto;するために指定された幅が必要です。

footer {
  margin: auto;
  width: 960px;
  /* other styles */
}
于 2012-08-23T12:26:56.550 に答える
1

text-align:centerコンテンツセンターを揃える必要がありません。

于 2012-08-23T12:27:10.087 に答える
1

次のようにsmthを設定します。

<footer><span>Copyright<span></footer>

およびcss：

footer {
    margin: auto;
    height: 330px;
    width: 100%;
    background-color: #1e2127;
    color: #ffffff;
}

footer span {
    display:block;
    width: 50%;
    margin: 0 auto;
    text-align: center;
}
于 2012-08-23T12:27:19.600 に答える
1 
footer {
    margin: 0 auto;
    height: 330px;
    background-color: #1e2127;
    color: #ffffff;
}

マージン：0自動は、親コンテナにある程度の幅がある場合に機能します。それ以外の場合は、text-align:center;

于 2012-08-23T12:27:33.013 に答える