2 列のヘッダーとフッターの基本レイアウトでサイトをセットアップしました。私のページのほとんどでは、左の列が右に接続されていないため、これは機能します。ただし、あるページでは、左側の列に写真があり、右側に関連する説明があります。これらの要素は両方とも高さが異なりますが、幅は異なります。さて、右側の違いを補うために、高さを設定してクリアオール画像の間に div を配置することで、動作するようになりました。私がテストしたブラウザでは良さそうに見えますが、chrome、opera、firefox などを使用して最終的な外観を確認したところ、それぞれが空間を異なる方法でレンダリングしていることがわかりました。左の列の高さが一定ではないため、写真が右の説明と一致しません。サイト全体で 2 列のレイアウトの一貫性を維持したいと考えています。ここにページへのリンクがあります。まだ多くのトラフィックを期待していないので、立ち上げました。ご提案ありがとうございます。
クレイグ
ブラウザーが異なれば、レンダリングも異なります (デフォルトの行の高さ、マージン、見出しのフォント サイズなど)。すべてを共通の値にするには、を使用することになっていますreset.css。最も人気があり、私がプロジェクトで一般的に使用しているのは、http://meyerweb.com/eric/tools/css/reset/です。私があなたのウェブサイトで見ることができるものから、あなたはreset.css. そのファイルのコピーを (添付のリンクから) 取得し、reset.css という名前を付けて、実際のstyle.cssファイルの前にインポートする必要があります。この場合、このルールの前にインポートする必要があります。@import url("site_css/craig-smith.css");
注:リセットをインポートした後、元の の一部を調整する必要がある場合がありますがcraig-smith.css、最終的には、レンダリングはすべてのブラウザーで同様/一貫して表示されます。