크롬하고 IE11, 엣지는 잘 뜹니다.
근데 왜 제목에 말씀드린 IE 구버전들과 파이어폭스에는 다르게 뜰까요?
별거 없는 소스인데...
left 옆에 right를 놓고 right안에 right2를 자식 div로 넣는것 뿐인데
브라우저마다 천차만별입니다.
left 넓이가 100%라 right가 옆으로 안붙고 아래로 내려가는거같은데
이게 또 크롬이나 최신 브라우저들에서는 원하는대로 옆으로 뜹니다.
혹시 IE 구버전들은 display : table 속성을 못쓰나요?
가르침 부탁드립니다.
Copy
<!DOCTYPE html><html><head><style>html,body{ height: 100%; width: 100%; padding-top: 0px; padding-left: 0px; } .wrap{ height: 100%; width: 100%; display: table; } #left{ height: 600px; width: 100%; display: table-cell; background-color: aqua; } #right{ height: 100%; display: table-cell; background-color: burlywood; } #right2{ height: 100%; width: 300px; background-color: crimson; }#chat{ height: 100%; width: 300px; position: fixed; top: 0px; right: 0px; background-color: darkmagenta; }</style> </head><body> <div id="left"></div> <div id="right"> <div id="right2"></div> </div> </body></html>답변 2개 / 댓글 1개
채택된 답변
+20 포인트
2017-04-03 (월) 13:42:25
ie 구버전은 사용추이로 보면 매우 미미합니다.
요즘 개발자들은 특수한 경우 빼고는 ie10이상으로 개발을 진행하는것으로 알고 있어요.
밑에 호환성 메타 넣어보면 다르게 보입니다.
<meta http-equiv="X-UA-Compatible" content="IE=edge">
답변에 대한 댓글 1개
헐크매니아
2017-04-03 (월) 13:53:13
senseme
2017-04-03 (월) 13:39:02
제일 상단에
html,body,form {margin:0; padding:0;}
이렇게 추가하시면 왼쪽으로 원하시는데로 붙을거에요.
답변을 작성하려면 로그인이 필요합니다.
이거 그냥 단순 IE구버전만 그러면 무시하려고 했는데 파이어폭스 최신까지 이러니 그냥 넘어갈수가 없네요.