모바일 가이드 보고 position 비율값 찾기

만약 모바일 가이드를 가지고 다람쥐 이미지를 position으로 띄웠다고 가정, 

다람쥐 이미지는 328px * 184px 이라고 가정을 하고, 

오리는 top: 10px , left: 10px 이라고 가정을 해봅니다. 

이럴땐, 

 

퍼센트 계산기를 사용해야 합니다. 

이런경우 여러 해상도에 맞춰 오리위치가 바뀌므로 오리 위치를 px로 고정하는 것이 아니라 퍼센트 계산을 통해 값을 넣어야 합니다. 

계산법 ) 

left값 : (10px / 328px) * 100% = 3.04% 

Top값 : (10px / 184px) * 100% = 5.43%

 

CSS

position: absolute; 
top: 5.43%;
left: 3.04%;