友達のウェブページの修正を手伝おうとしています。彼女は彼女のためにサイトを作るために男に800ドルを支払いました、そしてそれが上がるとすぐに、彼はそれをiOS Safari （彼が約束したように）互換性を持たせずに跳ねました。彼女はこの男を手に入れることができず、それは数ヶ月後です。とにかく、私は彼女を助けようとしています。www.avasassi.com
- ビューポートタグを修正しようとしました
- iOSサファリではディスプレイ全体が大きすぎて表示されました
- ページを表示するために適切にズームアウトできませんでした
- 彼女はそれが正しくロードされることを望んでおり、最初のロードアップを中心にしています
- すべてのページにこの問題があります
- これまでのところ、index.hmtlとprojects.htmlのみを調整しました
元のビューポートタグは...
<meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=1;" name="viewport">
私はそれをこのビューポートタグに微調整してみましたが、平凡な結果が得られました
<meta name="viewport" content="width=device-width, initial-scale = 0.5" />
- 次のプロジェクトページ（projects.html）
- は、FirefoxとChromeを中心に、iPhoneのサファリを中心とした個々の画像を示しています。
- 中心から外れていて、ページ全体に及ばないようにオレンジ色のバーを短くカットしています
- 画像はヘッダーの中央に配置されていません
プロジェクトページの画像のコードは次のとおりです...
<section id="frame">
<div class="row1 cbox"><a class="samlink" href="saltysam.html"></a></div>
<div class="row2 cbox"><a class="spicelink" href="spicemates.html"></a></div>
<div class="row3 cbox"><a class="khloelink" href="khloe.html"></a></div>
<div class="row4 cbox"><a class="simonlink" href="simon.html"></a></div>
<div class="row5 cbox"><a class="thrivelink" href="thrive.html"></a></div>
</section>
CSS
#frame {
width: 450px;
height: 1850px;
margin: 0 auto;
position: relative;
display: block;
＆
.cbox {
position: absolute;
overflow: hidden;
opacity: 1.0;
filter: alpha(opacity=100);
width: 450px;
margin: 0 auto;
ありとあらゆる助けに感謝します。乾杯。