드롭다운메뉴 css 어떤부분때문에 펼쳐져 있는걸까요?

zes 자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2017.04.25 17:40:56 4450 (1.♡.♡.180)

답변 2

본문

드롭다운메뉴때문에 요즘 고생중입니다ㅠㅠ

pc사이트에서는 제대로 나오는데 모바일에서 밑에 이미지 보면 메뉴아이콘을 누르면

메뉴들이 나오는데 메인메뉴만 보이고

메인메뉴 클릭 > 서브메뉴가 펼쳐져야 하는데

메인이랑 서브 상관없이 다 펼쳐져서 나오네요ㅠㅠ

css소스중에 뭐때문에 몽땅 펼쳐져서 나오는걸까요 ㅠㅠ

.navbar-default .navbar-nav li{
background-color: #fff;

}

.navbar-default .navbar-nav>li> a{
color:#333;
font-size: 18px;
background: #f0f0f0;
background:#eee;
}

.navbar-default .navbar-nav .dropdown-menu>li{
color: #CCC;
font-size: 16px;

}

.navbar-default .navbar-nav>li> a:hover .dropdown-menu {
display:block;
width: 100%;
position: absolute;
top: 30px;
}

.navbar-default .navbar-nav .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .dropdown-menu>li>a:hover {
font-weight:500;
background-color:#fff;

}

.navbar-default .navbar-nav .dropdown-menu>.active>a, .navbar-default .navbar-nav .dropdown-menu>.active>a:focus, .navbar-default .navbar-nav .dropdown-menu>.active>a:hover {
color:#555;
background-color:#e7e7e7
}
.navbar-default .navbar-nav .dropdown-menu>.disabled>a, .navbar-default .navbar-nav .dropdown-menu>.disabled>a:focus, .navbar-default .navbar-nav .dropdown-menu>.disabled>a:hover {
color:#ccc;
background-color:transparent

}

#그누보드5

답변 2

내가누구야 자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2017-04-25 17:46:56 1.♡.♡.42


.dropdown-menu {
	position:absolute;
	top:100%;
	left:0;
	z-index:1000;
	display:none;
	float:left;
	min-width:200px;	
	padding:5px 0 5px 0 ;
	font-size:14px;
	text-align:center;
	list-style:none;
	background-color:#000;
	background: rgba(0, 0, 0, 0.5);
	-webkit-background-clip:padding-box;
	background-clip:padding-box;
	border-radius:4px;
	-webkit-box-shadow:0 6px 12px rgba(0, 0, 0, .175);
	box-shadow:0 6px 12px rgba(0, 0, 0, .175)
 
}

이부분에서 보시는거와 같이 display:none 이 존재하는지의 여부에 따라 서브메뉴를 보여지게 하는 부분이라고 보실 수 있으실텐데요

이부분의 css는 미디어쿼리 992 이상에만 적용되어진걸로 보여집니다

모바일에서는 none 처리되어있다가 클릭 또는 오버시에 보여져야 한다는 css 코드가 전혀 보이지 않는 것으로 보입니다.