테스트 사이트 - 개발 중인 베타 버전입니다

display: inline-block; 에서 정렬 순서를 바꿀수있을까요? 채택완료

그누보드초보이용자 6년 전 조회 3,000

display: inline-block; 에서 정렬 순서를 바꿀수있을까요?

  • 1
  • 2
  • 3
  • 이면 결과는 1 2 3 으로 정렬될텐데;;

    이걸 3 2 1 로 거꾸로 할수있는 방법이있을까요?

    float:right말구 display: inline-block;로 할려고 하고있습니다.

    댓글을 작성하려면 로그인이 필요합니다.

    답변 2개

    채택된 답변
    +20 포인트
    SLOOP
    6년 전

    css로도 순서 변경이 가능하긴 합니다. 하지만 좀 더 다용도로 사용하기 위해선 jquery로 처리하는 방법을 추천드립니다.

    로그인 후 평가할 수 있습니다

    댓글을 작성하려면 로그인이 필요합니다.

    6년 전

    inline-block 으로 하는 방법은 float를 조정하는 방법밖에 없으면 불완전합니다.

    예를 들어

    </p>
    
    <p>UL[myUL] li:nth-child(1) { float:right; }</p>
    
    <p>UL[myUL]  li:nth-child(2) { /*정의안함*/ }</p>
    
    <p>UL[myUL]  li:nth-child(3) { float:left; }</p>
    
    <p>

     

    위와 같이하면 아래와 같이 정렬됩니다만... 크기를 맞추어주어야 하고..

    순서의 정렬이 불안정합니다.

    float:right 순서대로 오른쪽에 쌓이는 것입니다.

    만약 다섯개정도되면서 2,1,3,5,4 는 안된다는 것이죠....

    그래도 어거지 피우면 할수도 있긴 합니다만 욕먹는 코드가 나오게 될 겁니다.

    스스로 하시면 화나는 코드가 되고요

    ----------------------------------------------------------------------------

  • 3
  • 2
  •                               
  • 1
  • ----------------------------------------------------------------------------

    로그인 후 평가할 수 있습니다

    댓글을 작성하려면 로그인이 필요합니다.

    답변을 작성하려면 로그인이 필요합니다.

    로그인