@media 쿼리에서 내비게이션을 어떻게 이동합니까?

Question

왼쪽에서 내비게이션을 사용하여 데스크톱을 볼 수 있습니다. 작은 브라우저에서 볼 때이 같은보고를하고 싶은

LO 
GO 
__ 
__ 
__ 

: 나는 그것이 보이는 지금 ... 나는 작은 장치의 화면 상단으로 이동하려는

생각 :

LO -- -- 
GO -- -- 

일반보기 CSS는 : 나는 시도

#nav { 
width: 130px; 
padding: 10px 10px 150px; 
} 

.nav-links { 
list-style: none; 
margin: 0; 
} 

:

@media all and (max-width: 480px) { 
    #nav { 
    width: 25ems; 
    height: 7ems; 
    position: absolute; 
    top: 0; 
} 

    .nav-link a, .nav-link span.link-placeholder { 
    font-size: 10px; 
    padding: 0 10px; 
    line-height: 30px; 
    top: 0; 
} 

하지만 그럴 수는 없지만 ... 내가 뭘 잘못하고 있는지 알아?

Answer 1

나는 답을 얻지 못하고 넘어지기에 충분하지 못했습니다. float : 왼쪽; 추가와 갑자기 모든 것이 줄선.

너비를 40 %로 설정하여 링크와 로고 공간을 마련했습니다. 여기에 최종 CSS가 있습니다 :

@media all and (max-width: 480px) { 
    #nav { 
    height: 150px; 
    position: fixed; 
    width:100%; 
    top: 0; 
} 

.nav-links { 
    position: absolute; 
    top: 10px; 
    left: 147px; 
} 

.nav-link { 
    display:inline; 
    padding: 0 10px 0 0; 
    float:left; 
    width:40%; 
    height:auto; 
    font-size: 8.85px; 
}