2011-08-12 22 views
5

私はiPhone開発者ですが、私はCSSで少しゴミがあり、私は自分のアプリケーション用のウェブページを作ろうとしています。CSSフッタ固定幅、画面の下端、中央に配置

は、私は私のフッターを作りたい、次の特性があります。

  • 中心に640ピクセル幅
    • 固定幅画面、ないページの底部に取り付けられています。したがって、ユーザーがウィンドウのサイズを変更すると、フッターは常に下に表示されます

    他のすべてのスタイリング私は自分自身で行うことができます。

    CSSでこれを行う方法を教えてもらえますか?

  • +0

    が重複する可能性を中心に作るために左からそれを320PXを移動する必要があります(http://stackoverflow.com/questions/5189238/how-to-make-a-footer-fixed-in-the-page-bottom) – lnafziger

    答えて

    11
    footer { 
        width: 640px; 
        margin: 0% -320px; 
        position: fixed; 
        left: 50%; 
        bottom: 0%; 
    } 
    

    例:テキストの山とhttp://jsbin.com/imisig/3

    例:http://jsbin.com/imisig/4

    +0

    ありがとうございます - これは今では正しい –

    +0

    問題はありません。お力になれて、嬉しいです! –

    +1

    どのように流体を60%にするためにコードを修正しますか?ちょうど興味がある – epoch

    1

    <div id="footer">にフッターのHTMLを入れてください。それは

  • bottom: 0pxがそれを作るページをスクロールするよう

    #footer { 
        width: 640px; 
        position: fixed; 
        bottom: 0px; 
        left: 50%; 
        margin-left: -320px; 
    } 
    

    説明widthプロパティが640pxに幅を設定します

    • position: fixedがそれを行います。そして、CSSはこのようなものになるだろうページの下部に固定されています(下から上への距離= 0px)
    • left: 50%は、ページ
    • margin-left: -320pxの中心にdivのT側 - 今、私たちはそれが[ページの一番下に固定フッターの作り方]の
  • +0

    'margin'と' auto'は 'fixed'の' position'でうまく動作しません。フッターは画面の左側に表示されます。改善された方法については私の答えを見てください。 –

    +0

    ええ、ちょうど私の答えを編集しました。あなたはパンチに私を打つ:) – tskuzzy

    +0

    問題はありません。ところで、 '-310px'は' -320px'になります。 –

    関連する問題