2013-11-15 2 views
0

레이아웃 웹 사이트의 부트 스트랩을 사용하고 있습니다.끌어 오기를 사용하는 요소의 부트 스트랩 순서

<section class="content"> 
    <div class="intro col-lg-3 col-md-4 col-sm-12 col-xs-12"></div> 

    <div class="slider col-lg-9 col-md-8 col-sm-12 col-xs-12"></div> 
</section> 

이 잘 작동 : 나란히 배치되어 2 개 사업부의, 하나의 왼쪽과 한 권리를 가지고있는 경우 이가 좋아하는이 보인다. 그러나 화면이 "sm"및 "xs"클래스에 도달하면 슬라이더 div를 왼쪽으로 가져 오려고하고 인트로 div를 오른쪽으로 끌어 내려 슬라이더 div가 인트로 div 위에 표시되도록합니다.

부트 스트랩의 풀 클래스가 있음을 알게되었습니다.

그래서 소개에 "끌어 오기 - 오른쪽"을 추가하고 슬라이더에 "끌어 오기 - 왼쪽"을 추가했습니다. 정확히 내가 원하는 것, 하지만 그것은 "lg"및 "md"클래스가 트리거되는만큼 원하는만큼 수행합니다. div의 전체 너비가 정해지면 정상 순서가됩니다.

"sm"및 "xs"클래스에서 작동하는 방법이 있습니까? 아니면 내가 잘못하고있는 것입니까? 감사합니다 :)

답변

1

푸시 풀 클래스를 사용해보십시오. 아래 코드를 사용해보십시오

<section class="content col-lg-12 col-md-12 col-sm-12 col-xs-12"> 
    <div class="intro col-lg-3 col-md-4 col-sm-4 col-sm-push-8 col-xs-4 col-xs-push-8"></div> 

    <div class="slider col-lg-9 col-md-8 col-sm-8 col-sm-pull-4 col-xs-8 col-xs-pull-4"></div> 
</section> 
+0

입력 해 주셔서 감사합니다.하지만 원하는대로하지 않았습니다. 무엇보다도 "lg"및 "md"클래스가 트리거 될 때 레이아웃에 영향을주었습니다. 이상한 것을 발견했습니다. 또한 작은 화면에서는 정확하지 않습니다 (http://oi39.tinypic.com/2vx4xup.jpg 참조). 요소가 더 이상 전체 폭이 아닙니다. – ronnyrr

+0

전체 섹션을 공유 할 수 있으므로 행 클래스가 어떻게 형성되는지 알 수 있습니다. 행으로 묶이지 않고도 열 내부에서 열을보고 있습니다. – Debananda