0

私のウェブサイトが役立つためには、多くの画面スペースが必要です。正常に機能する最小幅は約1200ピクセルです。問題は、低解像度の画面（iPhoneまたは古いコンピューター）で開いたときに、ページが画面に完全に収まらず、左側で切り取られることです。

誰かが私がそれをすることができるという考えを持っていますか？代わりにそれはただスクロール可能であるでしょう？

ページ全体にCSSレイヤーを使用しています

#page {
position:absolute;
left:50%;
width:1200px;
margin-left:-600px; 
}

そして、このレイヤーの中に実際のコンテンツがあります。

#content {
width:1200px;
text-align: left;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
font-weight: normal;
color: #aaaaaa;
clear:both; 
margin-top:40px;
}

おそらく理由はmargin-left：-600pxの設定であると理解していますが、コンテンツブロック全体が中央に配置されていることを確認するにはどうすればよいですか？それとも、代わりに左側に揃える必要がありますか？

どんな助けでも大歓迎です！

PS-Webサイトはhttp://textexture.comにあり、これが私が使用するCSSです：http：//textexture.com/templates/styles.css

ありがとうございました！

4

4 に答える 4

5

代わりにこれを試してください：

#page {
    width: 1200px;
    margin: 0 auto;
}

#content {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: #aaaaaa;
    clear:both; 
    margin-top:40px;
}

絶対測位には複雑さが伴い、実際に必要な場合にのみ一般的に使用する必要があります。

#pageまた、個別の#contentdivを使用する理由はないようです。#pageそれらを削除して組み合わせてみてください。

#content {
    width: 1200px;
    margin: 0 auto;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: #aaaaaa;
    clear:both; 
    margin-top:40px;
}
于 2012-06-27T10:56:59.330 に答える
3

解像度の低いユーザーが Web サイトを使用できるようにしたい場合は、より低い解像度でも機能するように作成する必要があります。これを行うにはいくつかのテクニックがあります。リンク先の Web サイトは非常にシンプルに見えるので、スタイリングの一部を変更するのは難しいことではありません。

レスポンシブ Web デザインと、CSS でのメディア クエリの使用を参照してください。

于 2012-06-27T11:03:24.130 に答える
1

このように % を操作することもできます。

#page {
    width: 100%;
    margin: 0 auto;
}

#content {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: #aaaaaa;
    clear:both; 
    margin-top:40px;
}
于 2012-06-27T12:58:42.993 に答える