Bootstrap 3 - фиксированная ширина + жидкость колонны, повторно заказные колонны, колонны желобов

Question

Я прочитал некоторые пост здесь относительно следующих параметров:

1. переплета между колоннами
2. Нет водосток на «Мост слева» и «Большинство правые» колонны
3. 2 Фиксированные колонки размер
4. колонны Re порядка на основе размеров экрана

у меня есть макет, которые требуют сотрудничества все. Прилагается layout макет. И вот что я сделал до сих пор jsfiddle

<div class="container"> 
    <div class="row"> 
    <div class="col-lg-6 col-md-6 col-sm-6 a">News</div> 
    <div class="col-lg-3 col-md-3 col-sm-12 b">Videos</div> 
    <div class="col-lg-3 col-md-3 col-sm-6 c">MRec1</div> 
    <div class="col-lg-3 col-md-3 col-sm-6 d">MRec2</div> 
    <div class="col-lg-3 col-md-3 col-sm-6 e">Button1</div> 
    </div> 
</div> 

jQuery(document).ready(function() { 

    $(window).resize(function() { 
    iTargetWidth = $(window).width(); 
    if (iTargetWidth <= 768) { 
     $(".b").insertAfter(".e"); 
     $(".c").insertBefore(".a"); 
    } 
    }); 
}) 

Answer 1

1. Столбцы т.е. элементы с class="col-*-*" имеют 15px отступов слева и справа.

2. Элемент с классом container имеет 15px отступов слева и справа. Класс row имеет запас -15px слева и справа. Это устраняет эффект отладки container.

3. Все col-*-* классы относительны.

4.To сделать это, вы должны использовать классы, как pull-md-left или pull-sm-right

Для лучшего понимания обратитесь к документации по http://getbootstrap.com/components/