flexbox 크로스 브라우저 문제 크롬이 올바르게 표시되지 않음
과
Flexbox 크로스 브라우저 문제를 디버깅하려고합니다. 고정 헤더가있는 스크롤 가능한 콘텐츠와 오프 캔버스 왼쪽 탐색 기능이있는 기본 성배 레이아웃이 있습니다.
레이아웃이 Chrome 45.0.2421.0m (64 비트)에서는 올바르게 표시되지만 Firefox 38.05에서는 표시되지 않습니다.
Chrome에서의 모습 
그림 Firefox에서의 모습 사진
Firefox의 문제
1) 스크롤바 없음
2) 바닥 글이 없거나 페이지에서 벗어남
3) 토글 버튼을 클릭 할 때까지 캔버스 외부 왼쪽 탐색이 보이지 않아야합니다.
4) 양쪽 열이 콘텐츠 열과 고르지 않고 약간 더 커 보입니다.
첨부 된 레이아웃 코드
@import url("http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css");
html, body {
box-sizing: border-box;
height: 100vh;
overflow: hidden;
margin: 0;
padding: 0;
}
*, *:before, *:after {
box-sizing: inherit;
}
.holy-grail {
display: flex;
flex-direction: column;
}
.body {
flex: 1;
display: flex;
flex-direction: row;
color: #333;
background: #333;
}
.content-wrapper {
flex: 1 1 auto;
order: 2;
background: #ffc94e;
display: flex;
flex-direction: column;
}
.content-header {
flex: 0 0 50px;
color: #eee;
background: #2a2a2a;
}
.content {
flex: 1;
overflow: auto;
}
.button {
cursor: pointer;
}
.button:before {
content: '\f0c9';
font: 42px fontawesome;
color: white;
}
.nav-wrapper, .sidebar-wrapper {
flex: 0 0 10em;
display: flex;
flex-direction: column;
}
.nav-wrapper {
order: 1;
transition: flex 1s
}
.nav-wrapper.isOpen {
flex: 0 0 0;
}
.sidebar-wrapper {
order: 3;
}
.nav-header, .sidebar-header {
flex: 0 0 50px;
color: #eee;
background: #2a2a2a;
}
.nav-content, .sidebar-content {
flex: 1;
overflow: auto;
color: white;
}
header {
background: #92e4c9;
height: 50px;
}
footer {
background: #f7846a;
height: 50px;
}<!doctype html>
<html lang="en">
<head>
<title>A Holy Grail Flexbox layout</title>
<link rel="stylesheet" href="styles.css">
</head>
<body class="holy-grail">
<header>
<h1>Header</h1>
</header>
<div class="body">
<main class="content-wrapper">
<header class="content-header">Content Header
<a id='button' class="button"></a>
</header>
<div class="content">TEST
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
TestEnd
</div>
</main>
<nav class="nav-wrapper isOpen" id="nav">
<header class="nav-header">Header</header>
<div class="nav-content">
Nav
</div>
</nav>
<aside class="sidebar-wrapper">
<header class="sidebar-header">Header</header>
<div class="sidebar-content">
TEST
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
TestEnd
</div>
</aside>
</div>
<footer>
<h2>Footer</h2>
</footer>
<script>
document.getElementById('button').addEventListener("click", function (e) {
document.getElementsByClassName('nav-wrapper')[0].classList.toggle('isOpen')
e.preventDefault();
});
</script>
</body>
</html> 오리올
이걸 더해:
.body {
min-height: 0;
}
@import url("http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css");
html, body {
box-sizing: border-box;
height: 100vh;
overflow: hidden;
margin: 0;
padding: 0;
}
*, *:before, *:after {
box-sizing: inherit;
}
.holy-grail {
display: flex;
flex-direction: column;
}
.body {
flex: 1;
display: flex;
flex-direction: row;
color: #333;
background: #333;
min-height: 0;
}
.content-wrapper {
flex: 1 1 auto;
order: 2;
background: #ffc94e;
display: flex;
flex-direction: column;
}
.content-header {
flex: 0 0 50px;
color: #eee;
background: #2a2a2a;
}
.content {
flex: 1;
overflow: auto;
}
.button {
cursor: pointer;
}
.button:before {
content: '\f0c9';
font: 42px fontawesome;
color: white;
}
.nav-wrapper, .sidebar-wrapper {
flex: 0 0 10em;
display: flex;
flex-direction: column;
}
.nav-wrapper {
order: 1;
transition: flex 1s
}
.nav-wrapper.isOpen {
flex: 0 0 0;
}
.sidebar-wrapper {
order: 3;
}
.nav-header, .sidebar-header {
flex: 0 0 50px;
color: #eee;
background: #2a2a2a;
}
.nav-content,
.sidebar-content {
flex: 1;
overflow: auto;
color: white;
}
header {
background: #92e4c9;
height: 50px;
}
footer {
background: #f7846a;
height: 50px;
}<!doctype html>
<html lang="en">
<head>
<title>A Holy Grail Flexbox layout</title>
<link rel="stylesheet" href="styles.css">
</head>
<body class="holy-grail">
<header>
<h1>Header</h1>
</header>
<div class="body">
<main class="content-wrapper">
<header class="content-header">Content Header
<a id='button' class="button"></a>
</header>
<div class="content">TEST
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
TestEnd
</div>
</main>
<nav class="nav-wrapper isOpen" id="nav">
<header class="nav-header">Header</header>
<div class="nav-content">
Nav
</div>
</nav>
<aside class="sidebar-wrapper">
<header class="sidebar-header">Header</header>
<div class="sidebar-content">
TEST
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A animi aut distinctio dolor eaque enim fuga
labore perspiciatis unde? Accusamus atque consectetur eaque et modi molestias provident ratione
reprehenderit ullam.
TestEnd
</div>
</aside>
</div>
<footer>
<h2>Footer</h2>
</footer>
<script>
document.getElementById('button').addEventListener("click", function (e) {
document.getElementsByClassName('nav-wrapper')[0].classList.toggle('isOpen')
e.preventDefault();
});
</script>
</body>
</html>Flexbox 모듈이의 초기 값을 변경하기 때문에 필요합니다 min-height.
flex 항목에 대해보다 합리적인 기본 최소 크기를 제공하기 위해이 사양에서는 CSS 2.1에 정의 된 min-width 및 min-height 속성 의 초기 값으로 새로운 auto 값을 도입합니다 .
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
에서 수정
관련 기사
Related 관련 기사
- 1
크롬 브라우저가 아닌 경우 Flexbox가 올바르게 작동하지 않는 이유는 무엇입니까?
- 2
크롬에서 CSS가 올바르게 표시되지 않음
- 3
Div가 올바르게 표시되지 않고 크기 조정 문제
- 4
배경 이미지가 데스크톱 브라우저에서는 올바르게 표시되고 모바일 브라우저에서는 표시되지 않습니다.
- 5
특수 문자는 브라우저에서 올바르게 표시되지만 phpMyAdmin에서는 스크램블됩니다.
- 6
HTML 텍스트가 올바르게 래핑되지 않음, 가로 스크롤바 문제
- 7
CSS 문제로 인해 IE 및 Firefox에서 페이지가 올바르게 표시되지 않음
- 8
브라우저에 글꼴이 제대로 표시되지 않음
- 9
XSLT XML이 브라우저에 제대로 표시되지 않음
- 10
<br /> (이스케이프 됨)의 JSON 출력이 브라우저를 올바르게 해석하지 않음
- 11
패널 제목이 올바르게 표시되지 않음
- 12
관련 제품이 올바르게 표시되지 않음
- 13
크롬-브라우저 콘솔 "정의되지 않음"에서 자바 스크립트 기능 실행
- 14
Google 크롬에 글꼴이 제대로 표시되지 않음
- 15
"Chrome이 올바르게 종료되지 않았습니다."라는 메시지가 표시됩니다. 크롬 북에서
- 16
MahApps Metro 제목 표시 줄 단추의 스타일이 올바르게 지정되지 않음
- 17
자바 스크립트 if 문 문제 : 웹 페이지에 표시되지 않음
- 18
R 마크 다운 PDF 파일의 인라인 코드가 올바르게 표시되지 않음
- 19
Google 크롬이 웹 페이지를 올바르게 렌더링하지 않음
- 20
Google 크롬이 웹 페이지를 올바르게 렌더링하지 않음
- 21
데이터베이스에서 쿼리 할 때 문자열이 올바르게 표시되지 않음
- 22
제거 스크립트가 올바르게 수행되지 않음
- 23
Google 크롬 : 수학 기호가 올바르게 표시되지 않습니다.
- 24
Android 페이징 라이브러리가 올바르게 스크롤되지 않음
- 25
json의 Unity3D UI 텍스트 문자열이 올바르게 표시되지 않음
- 26
자바 스크립트 정렬이 문자열로 올바르게 작동하지 않음
- 27
자바 스크립트 표시 == "없음"실제로 표시되지 않음
- 28
Jquery 라이브러리가 올바르게로드되지 않음
- 29
div 요소의 배경 이미지가 Dolphin 브라우저에서 올바르게 확장되지 않음
몇 마디 만하겠습니다