%에 따른 모바일 레이아웃 질문
가람슬기
!doctype html
html lang=ko
head
title/title
meta http-equiv=Content-Type content=text/html; charset=utf-8
meta name=viewport content=user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width, target-densitydpi=midium-dpi /
style
* {padding:0; margin:0;}
html,body {width:100%; height:100%;}
#wrap {height:100%;}
.menu01 {width:100%; height:100%; overflow:hidden;}
.menu01 li {float:left; list-style:none; width:32%; height:32%; background:#ddd;}
.menu01 .big {width:66%; height:66%;}
/style
/head
body
div id=wrap
ul class=menu01
li class=big1/li
li style=float:right2/li
li style=float:right; margin-top:2%3/li
li style=clear:both; margin-top:2%4/li
li style=margin-left:2%; margin-top:2%5/li
li style=margin-left:2%; margin-top:2%6/li
/ul
/div
/body
/html
이 태그로 퍼센트로 작업을 했는데 이상하게
1번 높이와 2번 + 3번 + margintop2% 가 높이가 틀립니다. 왜 그럴걸까요
높이로 66%와 32%+32%+margin-top:2% 는 왜 다르게 먹을까요
32%+34% 하면 제대로 같게 들어갑니다
해결방법 없을까요?
-
뽀송뽀송
화면에 꽉차게 보여야되서요
-
총알탄
높이를 굳이 %로 줘야 하는 이유가 있나요?