브라우저가 작아지면 Li를 수직으로 수평으로 변경하십시오.

Question

나는 <ul>리스트를 가지고 있습니다. 모든 <li> 항목이 수평으로 표시됩니다. 내가하고 싶은 일은 브라우저가 너무 작아서 다음 행으로 넘어 가지 않고 모두 수평으로 유지할 때 마지막 두 개의 <li> 항목을 세로로 쌓아 넣기를 원합니다.

난 당신이 모든 항목 수평 정렬 만 볼 수 example

그래서 jsfiddle을 만든

대신 항목 5의 디스플레이 창을 축소하고 난 다음 수평으로 적재 할 다음 행으로 6 낙하로 같은 선에 머물러 라.

어떻게하면됩니까?

Answer 1

<ul>에 text-align property을 사용하면 도움이됩니다. 이처럼

사용 :

ul { 
    display: inline-block; 
    text-align: right; 
} 

는 Demo

작업

Answer 2

text-align: right; 

트릭을 수행해야하는이 내용을 <ul>에 추가하십시오.