1

border-radiusプロパティを使用しているdivでborderプロパティを使用しようとしています。

これが私のCSSです：

#page {
    border: 1px solid #beb2b2;
    width: 732px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

ご覧のとおり、境界線の半径（ブラウザごとにすべての異なるプロパティを含む）と1pxの境界線を配置しました。問題は、境界線が両方の上部コーナーに描画されていないことです。下隅を含む他のすべての場所に描画されます。グーグルで何かを探しましたが、何も見つかりません...

何か案が ？

4

3 に答える 3

1

あなたのcssが正しいので、他のマークアップとスタイルの問題：dabbletのテストケース ここに画像の説明を入力してください

マージンを追加してみてください：#page { margin: 15px; }境界線が単純に見えないか、非表示のコンテナである可能性があります#pageborderoverflow: hidden;

更新：問題は内部にも存在する可能性があり、image一部の親プロパティをオーバーライドまたは無視する可能性があります（例border-radius）。

于 2012-06-14T15:33:34.620 に答える
0

ページの高さは定義されていません。そのため、ウィンドウ全体にまたがっており、他の境界線を見ることができません。

多分それはそれが機能していない理由です。

変更を加えました。フィドルを参照してください。

HTML

<div id=page></div>​

CSS

#page {
    border: 1px solid #beb2b2;
    width: 732px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    margin: 10px auto; /* the extra line */
    height: 200px; /* the extra line */
}​
于 2012-06-14T15:33:24.857 に答える
0

高さの問題で底部が隠れてしまうのではないかと思いますが、高さを設定していただけませんか。

于 2012-06-14T15:35:01.720 に答える