ブラウザでズームインまたはズームアウトすると、Webサイトのレイアウトが「バラバラ」になります+その他のいくつかの基本的なCSSの質問
私はCSSに慣れていないので、今やろうとしているのは、中小企業向けの非常にシンプルで基本的なスプラッシュページまたはランディングページをデザインすることです。
このサイトのURLは次のとおりです。 私のサイト
ここで、任意のブラウザを使用している場合、たとえばgoogle chromeで、ズームアウトまたはズームイン（ctrl-/+）すると、Webサイトのレイアウトが「バラバラ」になり始めます。 divは動き始めたばかりです。私は明らかにこれを望んでおらず、人々がズームインまたはズームアウトしたときにサイトが同じままであることを望んでいます。
それはポジショニングと関係があるに違いないことは知っていますが、私たちの人生や私にとってそれを理解することはできません。昨夜、私は何時間も同じような質問を閲覧しましたが、それを理解することができます。
より多くのスペースを占めるようにコードを投稿していません。URLを提供したので、そこからコードを取得できると思います。
また、さらにいくつかの小さな質問があります。
1）Chromeで私のサイトを開くと、ページの下部にある「利用規約」の後に、サイトが正常に終了することに気付くでしょう。ただし、Firefoxを使用すると、「利用規約」の後、いわば背景がしばらく続くことに気付くでしょう。これはなぜですか？どうすれば修正できますか？
2）ブラウザが異なれば、要素の配置がわずかに異なることに気付くでしょう。最も目立つのは、chrome/firefoxを見てから、Internet Explorer 9を見ると、「利用規約」がchromeまたはff）よりもわずかに高く、メインコンテンツ領域にわずかに触れていることに気付くでしょう。 。これを修正する方法はありますか？
3）divを中央に配置するための効率的で効果的な方法は何ですか？たとえば、「サインアップ」ボタンをメインコンテンツ領域の中央に完全に配置したいとします。 iveはほとんどそれを監視し、相対位置を使用して中央に配置しています。それを中央に配置するためのより正確な方法は何ですか？
ありがとう、そしてこれらの質問が少し冗長に思えるなら申し訳ありません。何か説明が必要な場合は、タカのようにこの質問を監視します。
乾杯
ズームインまたはズームアウトすると、丸めやテキストのレンダリングが原因で問題が発生します。レイアウトが壊れることなく少し伸びても耐えられることを確認することをお勧めします。
相対的な位置付けは、＃1で説明した問題の影響を受けるため、信頼性が低くなります。
さまざまなブラウザが適用するプロパティを削除するために何かを使用することを検討してください。 reset を使用してより実用的なものを提供するか、 normalize 値を使用して、ブロワー間でより均等にすることができます。
（水平）センタリングには、いくつかのオプションがあります。
- 「text-align：center」のコンテナがある場合、インラインブロックまたはインラインであるすべての子要素が中央に配置されます。
- ブロック要素を中央揃えにする場合は、「margin：0 auto」を使用して水平方向に中央揃えにし、垂直方向の余白を削除できます。
- 絶対位置の要素を中央に配置する場合は、「左：50％、マージン-左：-（要素の幅/ 2）」を使用できます。 。
相対的な配置を取り除くことに加えて、body要素の高さを明示的に設定しないことをお勧めします。一般に、要素が独自のサイズを管理するようにします。そうすれば、要素はより堅牢になります。
「position：relative」を使用する場合は、「float：left」（またはright）を使用するか、表示タイプ（display：inline-block）を変更することをお勧めします。それはあなたが正しい方向に始めるのを助けるかもしれません。
ポイント1と2についてはわかりませんが、3については、次のようになります。divを中央に配置してから、width : some-percentage; margin-left : 100-(some_percentage)*0.5 ;を使用します。使いたい幅。