2013-06-04 1 views
11

http://facebook.com과 비슷합니다. 페이지 상단에있는 탐색 모음 유형의 코드를 사용하면 어떻게 할 수 있습니까? 그 한 가지 문제를 제외하고 내 CSS 고급 메뉴가 작동합니다. 물론 여기 내 링크 내 jsfiddle 지금 CSS내 CSS 메뉴를 화면 상단에 유지 하시겠습니까?

#cssmenu ul { margin: 0; padding: 0;} 
#cssmenu li { margin: 0; padding: 0;} 
#cssmenu a { margin: 0; padding: 0;} 
#cssmenu ul {list-style: none;} 
#cssmenu a {text-decoration: none;} 
#cssmenu { height: 42px; background-color: rgb(35,35,35); box-shadow: 0px 2px 3px rgba(0,0,0,.4);} 

Js fiddle

주요 부품이다 이것은 JsFiddle

확인하지 않을 경우이 부분으로 수행해야하는 메신저 착각하지 않을 경우

답변

33

은 메뉴 CSS에 다음을 추가

#cssmenu { 
    position: fixed; 
    left: 0; 
    top: 0; 
    width: 100%; 
} 

를 그들이 그것을 어떻게 기본적으로 있다고. 그것은 수행 할 수 있습니다

+1

이것은 페이지의 내용 상단을 숨기고 완전한 대답이 아닙니다. – josh123a123

+0

사실, @ josh123a123 - 내용을 메뉴 바로 아래에서 시작하도록 요소를 어떻게 수정합니까? –

4

고정 된 속성 추가

#cssmenu { 
      position:fixed; 
} 
+1

나에게 이길 지, 맞을 것이다. – box86rowh

+0

안녕하세요, 시도 했습니까? – ShibinRagh

+0

janak 사 그리고 똑같은 문제가 있지만 어쨌든 고마워요. –

3

당신이 사용하는 경우 :

position:fixed; 
+0

tryed 그것은 메뉴 막대를 변형 시켰습니다 –

1

를 사용하여 상단에 고정으로 설정하여 탐색 모음이 CSS를. 여기

#cssmenu { 
    position:fixed; 
    top: 0; 
    margin:auto; 
    left: 0; 
    right: 0; 
    width: 100%; 
    } 

데모 : http://jsfiddle.net/SkuhZ/

+0

나는 alredy가 Dineshkani를 체크 했는데도 불구하고 http://stackoverflow.com/questions/16910096/make-my-search-box-show-up-in-the를 도와 줄 수있었습니다. -right-position –

0

그냥이 3 할 것이다 ..

position: fixed; 
top: 0; 
width: auto; 
+0

선택기를 적용해야하는 정보와 원하는 효과를 얻기 위해 이들이 함께 작동하는 방식과 같은 정보를 추가하여이를 상세히 설명 할 수 있습니다. –

2

그냥 생각, 당신은 z-index: 1000; 그래서 모든 항목에 걸쳐 수레 것을 추가 할 필요가 없습니다 페이지에?

1

예, z-index: 1000;을 추가하여 모든 콘텐츠 위에 올릴 수 있습니다. 위에서 RLCJohn이 말했다.

관련 문제