목록을 올바르게 플로팅 할 수 없음

편집 임무 완수, 답장을 보내 주셔서 감사합니다. 누구나 확장 기능/페이드 아웃 기능을 클릭하면 도움이 될 것입니다. 나는 현재 그것을 조사하고있다.목록을 올바르게 플로팅 할 수 없음

나는 내 웹 사이트의 아주 간단한 탐색을 위해 노력하고 있습니다. 나는 왜 텍스트가 옳다 고 할 수 없는지 알 수 없다. 다음은 예입니다. http://jsfiddle.net/E6ArK/

클릭하여 펼치기 기능을 추가하고 잠깐보기 기능을 추가 할 수 있기를 바랍니다. 어떤 도움이라도 대단히 감사 할 것입니다.

HTML

<div class="navigation"> 
    <ul> 
     <li> 
      <h1>Applications</h1> 

      <ul> 
       <li>Not Available</li> 
       <li>Not Available</li> 
      </ul> 
     </li> 
     <li> 
      <h1>Forum</h1> 

      <ul> 
       <li>Not Available</li> 
       <li>Not Available</li> 
      </ul> 
     </li> 
     <li> 
      <h1>Guilds</h1> 

      <ul> 
       <li>Not Available</li> 
       <li>Not Available</li> 
      </ul> 
     </li> 
     <li> 
      <h1>Imageboards</h1> 

      <ul> 
       <li>People</li> 
       <li>Random</li> 
       <li>Screen Shots</li> 
       <li>Wallpapers</li> 
      </ul> 
     </li> 
     <li> 
      <h1>Projects</h1> 

      <ul> 
       <li>Not Available</li> 
       <li>Not Available</li> 
      </ul> 
     </li> 
    </ul> 
</div>

CSS

/* NAVIGATION */ 

/* Heading */ 
.navigation ul li h1 { 
    background : #000000; 
    color : #ffffff; 
    display : table; 
    font-weight : 100; 
    margin : 0; 
    padding : 6px; 
    border-right : 3px solid #ffffff; 
    font-size : 28px; 
    margin-bottom : 3px; 
} 
/* Positioning */ 
.navigation { 
    font-family :'Open Sans Condensed', sans-serif; 
    margin : 12px; 
    position : fixed; 
    right : 0; 
    top : 0; 
} 
.navigation ul { 
    font-size : 20px; 
    margin : 0; 
    padding : 0; 
    text-align : right; 
} 
.navigation ul li { 
    clear : right; 
    color : #ffffff; 
    float : right; 
    list-style-type : none; 
} 
/* Second Level */ 
.navigation ul li ul { 
    display : none; 
} 
.navigation ul li:hover ul { 
    display : block; 
} 
.navigation ul li ul li { 
    background : #000000; 
    border-right : 3px solid #ff0000; 
    color : #ffffff; 
    display : table; 
    font-size : 18px; 
    margin-bottom : 3px; 
    padding : 6px; 
}

출처

2013-02-19 Zifaun

을하는 데 도움이, 당신의 방법을 몇 가지 언급하는 그들 위에 떠있을 때 왼쪽으로 약간 이동합니까? –

당신은'.navigation ul li h1 {float : right; }' – Andy

감사합니다. Andy. 벽에 머리를 두드리는 동안 잠시만 기다려주세요. – Zifaun

당신은뿐만 아니라 오른쪽으로 제목을 떠해야합니다. .navigation ul li h1에 대한 규칙 블록에 float: right을 추가하십시오. 그것들은 계속 오른쪽으로 붙어 있어야합니다. 당신의 제목 스타일링 바로 부동산 :

출처

2013-02-19 14:58:44

당신은 단순히 float를 추가 할 필요가

/* Heading */ 
.navigation ul li h1 { 
    background : #000000; 
    color : #ffffff; 
    display : table; 
    font-weight : 100; 
    margin : 0; 
    padding : 6px; 
    border-right : 3px solid #ffffff; 
    font-size : 28px; 
    margin-bottom : 3px; 
    float: right; 
}

희망 "오른쪽 스틱 수 없음"으로

출처

2013-02-19 14:58:55

목록을 올바르게 플로팅 할 수 없음

답변

관련 문제