Bootstrap 3: pull-right for col-lg only

前端 未结 13 2153
醉酒成梦
醉酒成梦 2020-11-29 20:00

New to bootstrap 3.... In my layout I have:

elements 1
13条回答
  •  萌比男神i
    2020-11-29 20:34

    You could put "element 2" in a smaller column (ie: col-2) and then use push on larger screens only:

    elements 1
    elements 2

    Demo: http://bootply.com/88095

    Another option is to override the float of .pull-right using a @media query..

    @media (max-width: 1200px) {
        .row .col-lg-6 > .pull-right {
            float: none !important;
        }
    }
    

    Lastly, another option is to create your own .pull-right-lg CSS class..

    @media (min-width: 1200px) {
        .pull-right-lg {
            float: right;
        }
    }
    

    UPDATE

    Bootstrap 4 includes responsive floats, so in this case you'd just use float-lg-right.
    No extra CSS is needed.

    Bootstrap 4 Demo

提交回复
热议问题