0

弾力性のあるレイアウトを使用してサイトを構築しようとしています。Eric MeyerのCSSリセットを使用body {font-size:62.5%}し、スタイルシートでも使用しました。

編集：これが私のHTML構造とCSSです

<html>
<head>
</head>
<body>
<div id="container">
<div id="gallery">
</div>
<div id="other">
</div>
</div>
<div id="footer">
</div>
</body>
</html>

`html {bacgroound：url（）繰り返しなしの上部中央が修正されました;} 

body {font-family:Arial, Helvetica, sans-serif;
color:#000;
margin:auto;}

'id'other {background-color:color1;}  

'id'footer {background-color:color2;}

`

ご覧のとおり、の幅を固定するとbody、backgroundの#otherと#footerは固定されたままになります。そこで、を設定widthし、ギャラリーとのコンテンツを中央に配置することで、それを回避しようとしました。100%margin: 0 8em 0 8em#other#footer

私が達成しようとしているレイアウトは、基本的に写真のギャラリーを含む1列のレイアウトです。ギャラリー全体をページの中央に配置する必要があります。私はem定義marginに使用しましたが、これによりブラウザごとに異なる結果が発生します。ギャラリーが1つのブラウザーの中央に配置されている場合、他のブラウザーは異なる結果を表示します。Firefox、Chrome、IE9を試しました。

em測定単位として使用して同一のレイアウトを作成する方法はありますか？または、固定レイアウトを試して、px代わりに使用する必要がありemますか？

4

2 に答える 2

3

維持emまたはpercentanges。彼ら は 働きます。

ただし、それらをセンタリングに使用することは、おそらく問題の一部です。センタリングはauto、たとえば次のように実行する必要があります。

div.page {
  margin: 0 auto;
  width: 925px;
}
于 2011-12-30T15:23:15.330 に答える
2

あなたの矛盾は物事の組み合わせです。を定義するbody {font-size: 62.5%}と、基本フォントサイズ設定の62.5％でフォントを表示するようにブラウザに指示されます（これはユーザーが制御し、フォントごとに可変です）。次に、emcssカスケードの後半で使用すると、定義したフォントのサイズに基づいてスケーリング係数が再度適用されます（スケーリングの定義は困難です。http ：//webdesign.about.com/od/fonts/qt/em-を参照してください）。 origins.htm）。したがって、に設定されたブラウザのフォントは（14 * .625）に14pxなり、理論的には（8.75 * 2）になります。ブラウザにデフォルトの16pxフォントがある場合、2つの数値は理論的にはになります。8.75px2em17.5px10px20px

したがって、em単位の使用における不整合を支援するためpxに、タグに値と普遍的に認識可能なフォントbody（標準のWebフォントまたはおそらくによって）を設定すると、cssカスケードでより低い単位値@font-faceを標準化するのに役立ちます。em

Jason McCrearyの答えは、「固定幅」のコンテナがある場合は適切ですが、「マージンサイズを固定」する場合は、マージンにpxまたはem単位を設定するという現在のアイデアで、センタリングに適しています。

于 2011-12-30T15:47:40.433 に答える