css 초급문의 드립니다. 채택완료
안녕하세요
css 기본을 배우고 있는데요
이상하게 틀어지는 부분이 있어서요
화면으로 보면 아시겠지만 .top-box 영역안에 있는 배경red가 안나오고
안에 있는 div 코드들이 틀어집니다.
float을 쓰면 인식을 못하는거 같은데 왜 이러는 걸까요? ㅜㅜ
float 사용시 높이 값 주는거 말고는 방법이 없나요?
이유 좀 알려주세요~
</strong></p>
<p><!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>test</title>
<style>
div{display:block}
.top-box{width:100%; margin:0 auto; background:red;}
.top-box .nav-btn{ width:20%; float:left;}
.top-box .logo-btn{ width:60%; float:left; }
.top-box .cart-btn{ width:20%; float:left; }</p>
<p>.serch-box{background:#666; text-align:center;}
.navbar{width:100%; background:#999}
.top-notice{width:100%; background:#eee}
</style>
</head></p>
<p><body>
<div class="top-box">
<div class="nav-btn"><img src="imgs/cate_btn.jpg" /></div>
<div class="logo-btn"><img src="imgs/logo.jpg" /></div>
<div class="cart-btn"><img src="imgs/cart_btn.jpg" /></div>
</div>
<div class="serch-box">serch-box</div>
<div class="navbar">
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#" class="right">Link</a>
</div>
<div class="top-notice">
공지사항
</div>
</body>
</html></p>
<p><strong>
답변 2개
답변에 대한 댓글 2개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인