WP CSS 겹침 메뉴 하위 메뉴에서 배경 이미지를 제거 할 수 없습니다.

Question

WordPress 빌드에 사용하는이 챕터의 "겹침 탭"을 따랐습니다. 정말 근사하고 잘 작동합니다. http://www.codealamode.net/overlapping-tabs

그러나 자습서와 달리 이제 드롭 다운 하위 메뉴를 추가했습니다. css에 no-repeat가 있더라도 주 부모 배경 탭이 하위 메뉴로 옮겨지는 이유를 제외하면 큰 효과가 있습니다.

저는 데모를 찾아 CSS에서 전환 작업을 시도했지만 상황이 엉망입니다.

다음은 CSS입니다. 하위 메뉴에 주 부모와 같은 배경 이미지가있는 것을 원하지 않습니다. CSS는 링크 이름의 길이를 수용하기 위해 너비가 "확장"되는 엔드 캡과 배경 이미지가 탭에 표시되도록하는 것이 까다 롭습니다.

코드 : (이것은 그것의 모든하지만 배경 이미지가 어디 있는지 표시하는 것만으로는 충분하지 않습니다 너무 하위 메뉴를 보여줍니다) 문제의

.menu ul { 
list-style: none; 
position: relative; 
float: right; 
} 

.menu ul li { 
float: left; 
background: url(../wp-content/uploads/2012/08/inactive_right.png) no-repeat right; 
padding: 11px 54px 12px 0; 
} 

.menu ul li:hover > ul { 
display: block; 
} 

.menu ul li a:hover { 
color: red; 
} 

.menu ul ul { 
display: none; 
position: absolute; 
z-index:999; 
background-color: white; 
white-space: nowrap; 
} 

.menu ul li:last-child ul { 
right:0; 
} 

.menu ul ul li { 
clear: both; 
padding: 5px; 
} 

.menu ul ul li a:hover { 
color: blue; 
} 

이미지 일 - 엔드 캡이 너무 하위 메뉴에있는 방법을 볼? 나는 모든 것을 시험해 보았고 특히 Ul li에 묶여있을 때 왜 그것이 거기에 나타나는지 확신하지 못했습니다 ... ul ul li이 아닙니다.

menu problem http://glassdoctordenvermetro.com/wp-content/themes/GDDenverTheme/images/menu_problem.jpg

Answer 1

당신은 (.menu UL 리) .menu 내부의 모든리스트 항목에 배경을 설정하고 있습니다. 하위 메뉴가 목록 항목을 사용 중이며 .menu 안에 있기 때문에 스타일도 적용됩니다. 직접 하위 선택기를 사용하여 첫 번째 수준 만 잡습니다.

.menu > ul > li { 
    ... 
}