0

基本的に、この CSS を使用した div があります。

.mydiv{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    padding:7px;   
}​

ブラウザーは、パディング (幅 100% + 7px) により水平を
表示します。ここを見てください: http://jsfiddle.net/3FrLq/

そのdivに水平バーが表示されないようにするにはどうすればよいですか? （内部に別のdivを追加する必要はありませんか？）

4

6 に答える 6

5

を取り除き、width:autoに置き換えright:0ます。

jsFiddle の例

要素は絶対的に配置されるため、スクロールバーを呼び出さずに要素のコンテナの端に左右を事実上引っ張ることができます。

于 2012-11-13T20:33:32.717 に答える
2

box-sizing：border-box CSSプロパティを使用して、要素の実際の幅と高さからパディングと境界線を除外できます。

-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border -box;

これがフィドルです：http： //jsfiddle.net/3FrLq/3/

ボックスサイジングの詳細/ブラウザサポート： https ：//developer.mozilla.org/en-US/docs/CSS/box-sizing

于 2012-11-13T20:42:09.877 に答える
2

HTML セマンティクスを正しくするには、内部に別の要素が必要です。この場合、テキストを<p>タグで囲む必要があります。

marginこれを行うと、setまたはpadding内部要素にフックする何かが自動的に提供されます。

そうは言っても、内部要素を本当に持てない/持てない場合は、あなたwidthと setを削除してくださいright: 0。絶対配置要素の便利な点は、反対の位置を 0 に設定すると、要素を「伸ばす」ことができることです (これは上/下でも機能します)。

または、要素が完全に配置されていない場合は、に変更できますwidth: 100%(または、古いバージョンの IE のバグに対処するために行をmax-width: 100%追加します。そこまで戻る必要がある場合)。max-width全幅。これはここで動作しています - http://jsfiddle.net/3FrLq/5/。

于 2012-11-13T20:38:39.387 に答える
1

divを表示するように設定できますinline-block：

.mydiv{
    display: inline-block;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    padding:7px;   
}​

これにより、（水平方向に伸びずに）インラインで表示されますが、上下にパディングとマージンを適用できます（これとは異なります）。display: inline

于 2012-11-13T20:34:42.080 に答える
1

指定する幅を取り除き、指定するだけ0pxです。4面すべて

于 2012-11-13T20:37:24.477 に答える
1
  • IE8+ との互換性が十分である場合は、box-sizing.
  • 全幅でのみ動作させたい場合は、left&の両方rightをに設定0しますが、 を設定しないでくださいwidth。
于 2012-11-13T20:38:30.580 に答える