6

手に負えないサイトのURL：http: //chrism.se

ライブにした後、ビューポートがコンテンツに対して小さすぎてスクロールが必要な場合、背景画像（body-tag、repeat-x）が最初のビューを超えて拡張されないことがわかりましたが、拡張できません私の人生のために、それを修正する理由と方法を理解してください。覚えておくべき注意点は、私はJavascriptに精通しておらず、デザイナーが派手な効果を望んでいたため、自分でサイトをコーディングしなかったことです。私の先輩は確かに救済策を見つけることができましたが、残念ながら彼は不在であり、私はこれをまとめたいと思います。

htmlとcssの状態は、この問題を見つけたときと同じですが、主に最小幅を中心に、同様の質問で見た提案を試しました。背景の違いがビューポートと同じくらい広いのがよくわかりませんか？と私の問題？

フルビュー= i.imgur.com/ 6aDpN.jpg

問題= i.imgur.com/ X6JVp.jpg

4

5 に答える 5

2

IEはmin-widthをサポートしていないため、式を使用して同じことを行うことができます。

body {
    /* fix for most browsers, fill in desired width */
    min-width: 1000;

    /* IE Version, fill in desired width equal to the min-width, second value with 2px less */
    width:expression(document.body.clientWidth < 1000 ? "998px" : "auto" );
}
于 2011-05-31T15:57:19.617 に答える
1

私が見つけることができた実用的な解決策に最も近いものはからでした#bodyCurrent, #bodyNext：

  • を削除しright: 0ます。
  • 追加しmin-width: 1349pxます。

もう一度見てみると、それで十分かもしれません。

Firebugを使用して、Firefoxでのみテストされています。

于 2011-01-24T14:25:55.027 に答える
1

私はパーティーにかなり遅れていることに気づきましたが、同じ問題に遭遇し、この問題を修正するためにボディに最小幅を追加しました。あなたが提供したリンクにはまだこの問題があるので、もっとアドバイスが必要かもしれないと思います。水平スクロールバーが表示される場合、本体の最小幅は少なくともビューポートと同じ幅である必要があります。

ビューポートをスクロールバー用に十分に小さくし、Firefoxの3Dビューを使用してページを表示すると、何が起こっているかを簡単に確認できます。次に、リージョンフッターがボディ要素の幅を100％にするように設定されており、背景が正常に機能していることがわかります。ただし、本文自体はページの上部からのオーバーフローよりも小さいため、スクロールするとそのカットオフの外観領域が表示されます。したがって、body要素の最小幅をページ上部からのオーバーフローと同じ大きさにすると、すべて設定されます。これはかなり一般的な問題です（しばらくの間mailchimpで気づきました）。

于 2012-05-18T15:42:46.643 に答える
0

div#wrapperこれを：の背景に追加します。

background:url("../img/home.png") repeat-x scroll 0 0 #1B2E4C;
于 2011-01-24T13:32:23.267 に答える
0

IE7でテストしました：

html, body {
    position:relative;
    overflow:hidden;
    margin:0 auto !important;
}
于 2012-06-26T13:08:31.483 に答える