ページをズームしたときに要素のサイズを変更する方法を停止する方法

Question

HTMLとCSSの初心者です。ページのサイズを変更すると要素が凶暴になるという問題に直面しています。私は、メインのラッパーを作成し、最大の幅と高さを追加することからすべてを試しましたが、すべて役に立たない。ここで私のコードはCSSで見れます。

body { 
    background-image: url(3eMAHaa.jpg) 
} 

div.header { 
    border: 1px solid black; 
    border-radius: 50px; 
    padding-top: 26%; 
    padding-bottom: 26%; 
    padding-left: 10%; 
    padding-right: 10% 
} 

h1 { 
    ; 
    position: absolute; 
    top: 30%; 
    left: 40%; 
    color: #FF2B24; 
    font-family: helvetica 
} 

.someimage { 
    position: absolute; 
    top: 43%; 
    left: 32% 
} 

div.navbox { 
    border: 1px solid black; 
    border-radius: 50px; 
    padding-top: 70px; 
    padding-bottom: 70px; 
    padding-left: 500px; 
    padding-right: 500px; 
    position: absolute; 
    top: 1%; 
    right: 2% 
} 

img.about { 
    border: 1px solid gray; 
    position: absolute; 
    right: 80%; 
    top: 35% 
} 


} 
img.location { 
    border: 1px solid gray; 
    position: absolute 
} 
img.contact { 
    border: 1px solid gray; 
    position: absolute; 
    right: 15%; 
    top: 35% 
} 

Answer 1

をリサイズされることはありません、あなたのすべてのパディングコードを削除し、それを考え出しました。私は、より大きなDIVを親として設定し、他のすべての要素を相対的な位置に変更して、移動しないようにしなければなりませんでした。それは面倒だったが、それは働いた！ :)。また、パーセンテージは固定値ではなく、ズームすると狂気になるので、％の代わりにピクセルを使用してみてください。

Answer 2

人を気にしない、それは