0
적응 형 웹 사이트를 구축하는 동안 몇 가지 문제가 있습니다. 어떻게해야 참조 :CSS 적응 형 높이 문제
http://tweakers.net/ext/f/O1sEWJd53lwKA3Gv3W0CJDgW/full.png
내 CSS에서이 코드를 가지고 :
.HTML {
min-width: 100%;
height: 100%;
}
.page {
margin-top: 4.3%; /* 215px : 4960px */
margin-left: 4.76%; /* 172px : 3615px */
margin-right: 4.6%; /* 168px : 3615px */
height: 100%;
}
.header {
width: 100%;
height: 13.95%; /* 661px : 4737px */
}
.logo {
margin-left: 7.51%; /* 246px : pagewidth */
width: 28%; /* 918px : pagewdith */
height: auto;
float: left;
}
.searchbox {
margin-top: 24.4%; /* 161px : 661px */
float:right;
width: 22.4%; /* 737px : pagewidth */
}
헤더 클래스의 맨 위가 아닌 HTML의 맨 위부터. 방법이 너무 낮습니다. 이미지의 높이가 반응하기 때문에 응답 성이 필요합니다. 따라서 검색 상자는 바닥이 정렬되어 있기 때문에 로고 높이에 맞춰야합니다.
또한 헤더 높이의 5 % 높이가되어야하는 다른 클래스가 있지만 높이를 줄 때 : 5 %; Chrome 23에서 높이가 0px가됩니다. 어떻게 되나요?
내 HTML :
<body>
<div class="page">
<div class="header">
<div class="logo">
<img />
</div>
<div class="searchbox"></div>
</div>
</div>
</body>
일부 HTML도 게시 할 수 있습니까? – jflores
바로이 사이트를 서식에 조금 문제가 있지만, 여기 내 HTML입니다 : '