CSS 또는 Javascript에서 드롭 다운 메뉴가 작동하지 않습니까?

Question

내 드롭 다운 메뉴가 작동하지 않는 이유를 알아 내려고하고 있습니다.

는 여기에 내가 일하고 있어요 페이지의 : http://www.privateservercloud.com/ 당신이 "SEO 대시 보드"드롭 다운 메뉴가 나타납니다 '캠페인 관리 "의 왼쪽에있는 영역 위로 마우스 커서를 올려 놓으면

.

알아낼 수없는 드롭 다운 메뉴를 추가했을 때 3 가지 일이 발생했습니다. 그 li가 매우 왼쪽으로해야 할 때

1. 은 "SEO 대시 보드"링크를

   은 오른쪽으로 밀렸다.

2. "SEO Dashboard"텍스트는 사용자가 위에 올려 놓지 않으면 완전히 사라집니다.

3. 드롭 다운 메뉴는 ... 나는 그것을 사용하고 다른 웹 사이트에 표시되지 않습니다 거기에 검은 색 사각형이

사람이 때 발생하는 이러한 일들의 원인이 될지 볼 수 드롭 다운 메뉴를 추가 했습니까?

편집 : # 1을 제외한 모든 부분이 수정 된 것으로 보입니다. 'SEO 대시 보드'링크는 왼쪽에 있어야하지만 여전히 작동하지 않는 것으로 보입니다.

Answer 1

나는 아래의 각 문제를 해결하기 위해거야 : 그 리는 매우 왼쪽으로해야 할 때

1. "SEO 대시 보드 '링크가 오른쪽으로 밀렸다합니다.

모든 .navbar .nav 요소의 인라인 스타일은 left:156px;입니다. 삭제하면 귀하의 링크가 올바르게 표시됩니다.

2. "SEO 대시 보드"텍스트 위에 마우스를 올려 놓지 않으면 완전히 사라집니다.

첫 번째 .navbar .nav 요소의 인라인 스타일은 visibility:hidden;입니다. 이것을 제거하면 링크가 올바르게 표시됩니다.

3. 드롭 다운 메뉴는

당신이 .menu ul li ul li 요소에 list-style:none:를 추가하는 경우,이 수정해야 ... 나는 그것을 사용하고 다른 웹 사이트에 표시되지 않습니다 거기에 검은 색 사각형이있다 너의 문제.

Answer 2

먼저 관련성 높은 글을 게시하면 나중에이 질문을 보는 사람들에게 도움이 될 것입니다. html 및 CSS. 여러분이 그렇게하지 않으 셨으므로 여기에서하겠습니다 :

<ul class="nav" style="width: 158px; left: 156px; visibility: hidden;"> 
    <li><a href="https://mywebsite.com" class="subfoldericon">SEO Dashboard</a> 
    <ul style="margin-left: 1px; width: 185px; left: 156px; visibility: hidden;"> 
     <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li> 
     <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li> 
     <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li> 
     <li style="width:185px"><a href="test.php"><span style="width:241px">Test Menu</span></a></li> 
    </ul> 
    </li> 
</ul>  

왼쪽의 위치를 ​​하드 코딩하는 것이 문제입니다. 제거하면 목록 항목이 올바르게 떠있게됩니다.

Answer 3

1. "SEO Dashboard"를 언제든지 표시하려면 "visibility : visible;"을 추가하십시오. 선택기 ".navbar .nav> li> a"에있는 style.css 줄 66으로 이동하십시오. 왜냐하면 ul.nav는 가시성을 숨기고 li은 부모이므로이 속성을 가져 오기 때문입니다.

2. "text-align : left;"를 추가하십시오. 스타일 라인 148에 드롭 다운 메뉴를 위해 텍스트를 왼쪽으로 정렬시킵니다.

3. "list-style-type : none;"을 추가하십시오. 선택기 ".menu ul li ul li"에 대한 style.css 행 139에 검은 사각형을 제거하십시오.