サイト上で異なる画像の位置を設定しようとしています。私は、Avada Themeを使用して、基本的な列レイアウト(3列、2行)とCSSを作成し、より具体的な構成を作成します。私のdivsは、私が使用するimgのIDを含んでいます。私は、ページに下をロードする場合CSSの位置は、変更後にのみ更新されます
#note_col1_row1{
position: relative;
z-index: 1001;
top: 5%;
left: 3%;
-webkit-transform: rotate(-2deg) scale(1.3);
transform: rotate(-2deg) scale(1.3);
}
#note_col2_row1{
position: relative;
z-index: 1001;
bottom: 4%;
left: 4%;
-webkit-transform: rotate(4deg) scale(1);
transform: rotate(4deg) scale(1);
}
#note_col1_row2{
position: relative;
z-index: 1001;
left: 2%;
bottom: 22%;
-webkit-transform: rotate(2deg) scale(1.2);
transform: rotate(2deg) scale(1.2);
}
#note_col3_row1{
position: relative;
z-index: 1000;
top: 4%;
left: 5%;
width: 170px !important;
-webkit-transform: rotate(-2deg) scale(1.2);
transform: rotate(-2deg) scale(1.2);
}
#note_col2_row2{
position: relative;
z-index: 1000;
top: 5%;
left: 5%;
-webkit-transform: rotate(-4deg) scale(1.3);
transform: rotate(-4deg) scale(1.3);
}
#note_col3_row2{
position: relative;
z-index: 1000;
bottom: 15%;
-webkit-transform: rotate(2deg) scale(0.8);
transform: rotate(2deg) scale(0.8);
}
だから今私の問題は、トップ...位置はdiv要素には適用されませんされています。これは、F12でデバッグビューを開始し、値を他の値に変更する場合にのみ発生します(たとえば、「bottom:22%;」から「bottom:21%;」)。 これがこのように動作し、問題を解決する可能性がある理由はありますか?
あなたはJSFiddle/Plunkrの/ etcへのリンクを持っていた場合、答えるために容易になるだろう。 – Yani