top プロパティと left プロパティを使用して、jquery ポップアップ div を画面の中央に揃えようとしています。ブラウザー ウィンドウのサイズが変更されてもポップアップが中央に配置されるように、これら 2 つのプロパティに % 値を指定する方がよいと考えました。
しかし、実際にブラウザ ウィンドウのサイズを変更すると、期待どおりの結果になりません。
だから私の疑問は、上、左のプロパティに指定する % 値が画面の解像度に依存するかどうかです。それとも、親コンテナーのサイズに依存しますか?
彼らはそうかもしれません。パーセンテージは、それを含む要素に相対的です。その要素がたまたまウィンドウ自体である場合、そうです、それは解像度に関係しています。実際、親がそうである限り、常に画面の解像度に依存します。同じことが親の親などにも当てはまります。つかむのがちょっと大変。
基本的に、物事の階層内で要素の「上」にある要素が解像度に依存しない場合、要素も解像度に依存しません。しかし、親が解像度に依存しているかどうかを確認するには、その要素の親を確認する必要があります。そしてその後の親。などなど、トップまでずっと。または、それをテストして見ることもできます:)
「階層」のどこかに絶対位置/サイズの要素がある場合、画面解像度に依存しない可能性があります。
% は、次の相対的な親コンテナーのサイズに依存します。
パーセンテージは、親のサイズに依存します。ここを参照してください: http://jsfiddle.net/tqWhL/4/赤の div は #a と同じ幅です。
はブラウザ ウィンドウbodyの幅の 100% であるため、div を の子にして 100% の幅に設定できます。body