1

私のウェブサイトには、中央揃えのテキストを配置したい固定フッターがあります。奇妙なことに、テキストを何をしても中央に配置されず、代わりに常に左に配置されます。

<div id="footer">  
Copyright 2013 © LolStreamGallery - <a href="TermsofUse.html">Terms of Use</a>
</div>

CSS:

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
}

Body の CSS についても知りたいかもしれません。

body {
    background-color:#ededed;
    /*text-align:left;*/
    margin:0;
    padding:0px; 
}

ご覧のとおり、ボディのデフォルトの整列をすでにアウトコメントしようとしましたが、効果はありませんでした。誰でもアイデアはありますか？

4

5 に答える 5

5

これを次のように変更します。

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
    width:100%; // added
}

jsFiddle ライブデモ

于 2013-01-04T19:04:11.153 に答える
2

フッターは下部全体に広がる必要があります。width:100% を #footer スタイル要素に追加します。

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    width:100%;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
}

http://jsfiddle.net/4zqbX/

于 2013-01-04T19:04:53.333 に答える
2

に設定#footerするとposition: fixed、幅がなくなります。技術的には、 のコンテンツ#footerは引き続き の中心にありますが#footer、コンテンツ#footerの幅から幅を取ります。したがって、取り除くか、幅position: fixedを与える必要があります。#footer追加すればうまくwidth: 100%いく#footerはずです。

于 2013-01-04T19:11:22.967 に答える
1

#footer に幅を追加する必要があるかもしれません

#footer {
    text-align:center;  
    position:fixed;
    bottom:0px;
    height:30px;
    background-color:#ededed;
    font-family: "Myriad Pro";
    font-size:14px;
    /*New*/
    width:100%;
}​

テスト: http://jsfiddle.net/h6crw/1/

于 2013-01-04T19:05:35.370 に答える
1

これは、テキストが の中央にあるためですが、境界線を追加すると、がテキストと同じ大きさであることがdivわかります。div

width:100%;フッターに を追加するだけで完了です。

于 2013-01-04T19:05:47.987 に答える