0

CSS では、なぜこれが起こるのか本当に理解できませんでしたが、何かを割り当てるたびにmargin-top:50%、要素がページの下部に押し下げられ、ほぼ完全にページから外れます。50% の場合、要素はページの途中にあると思います。

これは、要素の幅と高さの属性を設定する場合にも発生します。div の幅を 100% に設定すると、div の右側が表示可能な画面からはみ出し、スクロールして表示する必要があります。

なぜそれが起こるのですか？それを修正する方法はありますか？

編集：

これが私のcssコードです。私もブートストラップを使用していますが、これはブートストラップ以外で気付いた問題です。

html{
height:100%;
min-height: 100%;
min-width: 100%;
}
#button_container{
width:100%;
clear:both;
margin:0 auto;
margin-top: 25%;
}

#donate_section, #contrib_section{
display:inline;
}
#contrib_section{
float:right;
}

ボイラー プレートの HTML マークアップ:

<body>
    <div id="someid"> 
         <div>
             <a></a>
         </div>
         <div>
             <a></a>
         </div>
     </div>
</body>
4

2 に答える 2

1

これを読んでから、もう一度読んでください: http://www.w3schools.com/css/css_boxmodel.asp

「幅」設定はコンテンツ セクションのみを設定しているため、合計幅はコンテンツ + マージン + パディング + ボーダーです。したがって、幅が 50% の場合、実際には 55% 程度になります (通常の小さいマージン/パディング/ボーダーを使用)。div が外部の 50% だけを占めるようにしたい場合は、その外側に 50% の非パディング/マージン/ボーダー div、または任意の数の他のソリューションが必要です。

また、ブラウザーのレンダリングが完全ではないという事実にも対処しているでしょう。スクロールを避けたい場合は、通常、幅の 100% を使用しないでください。(これも優れた「Web 2.0」設計です。その流派に従えば、使いやすさと読みやすさの観点から、両側に空白を配置する必要があります)。

編集:また、あなたの % は高さではなくwidthに相対的です。たとえば、CSS fluid layout: margin-top based on percentage grows when container width extendsを参照してください。

于 2013-02-17T03:40:38.643 に答える
0

多くの場合、参照は親要素に対して「相対的」です。body タグの最初の子について話している場合を除きます。

于 2013-02-17T03:41:02.730 に答える