0

ヘッダーとフッターで角を丸くしようとしています。ヘッダーを強制的に上に配置することはできましたが、フッターを強制的に下に配置できない理由がわかりません。

実際、位置は絶対です。下:0; それを行いますが、私のフッターはテキストの長さだけです。width:100%; を追加すると、フッターが ??? よりも大きくなります。

ここで私のコードを見ることができます: http://jsfiddle.net/fleduc/GN9q5/

4

6 に答える 6

2

あなたは設定left: 0しright: 0、そうではありませんwidth: 100%;-テストhttp://jsfiddle.net/thebabydino/GN9q5/3/を参照してください

このhttp://www.456bereastreet.com/archive/201112/the_difference_between_widthauto_and_width100/もお読みください。

ここで絶対配置がありwidth: auto、この場合はうまくいきませんが、パディングとボーダーのないコンテナーの幅width: 100%を意味することを理解する必要があります(を使用しない限り)box-sizing: border-box

于 2012-05-25T16:07:47.797 に答える
1

div の幅を px で指定しましたが、フッターの幅を px で指定していただけませんか? 例: http://jsfiddle.net/GN9q5/4/

于 2012-05-25T16:09:18.147 に答える
1

この CSS を変更するだけで動作します ;-) 

.rcs .ftr {                        
        margin:110px 0 0 0; 
        font-size:1.2em; 
        padding:5px 0px 5px 10px;        
        border-bottom-left-radius: 0.35em;
        border-bottom-right-radius: 0.35em;
        border-top:1px solid #AAAAAA;
    }

テストhttp://jsfiddle.net/GN9q5/5/を参照してください

于 2012-05-25T16:10:26.100 に答える
0

width絶対値で設定し、パディングを計算する必要があります。

例えば：

If you have a width of 960px and a padding of "5px", your with must be 950px.

You SHOULD remove it for reason that I don't exactly know.
于 2012-05-25T16:03:14.220 に答える
0

絶対配置された要素は、レイアウトの一部ではなくなりました。親要素の大きさがわからないため、幅を静的な値に設定する必要があります。

于 2012-05-25T15:59:02.503 に答える
0 
/*footer*/
.rcs .ftr {                        
    margin:0; 
    font-size:1.2em; 
    padding:5px 5px 5px 10px;
    position: absolute; 
    bottom: 0px;
    width: 385px;          
  border-bottom-left-radius: 0.35em;
  border-bottom-right-radius: 0.35em;
    border-top:1px solid #AAAAAA;
}

コンテナーの幅が 400px に設定されています。左右のパディング = 15px なので、それを差し引いて幅を 385px に設定します。

詳細:絶対位置と相対位置の幅と高さ

また、すべての宣言を必ず閉じてください。

于 2012-05-25T16:08:10.543 に答える