Вёрстка на Bootstrap. Плавающая сетка макета и Динамический дизайн - Joomla 3.x: Шаблоны, разметка и макеты вывода

  // Fluid grid
  #grid > .fluid(@fluidGridColumnWidth1200, @fluidGridGutterWidth1200);

// СЕТКА
// --------------------------------------------------


// По умолчанию 940px сетка
// -------------------------
@gridColumns:             12;
@gridColumnWidth:         60px;
@gridGutterWidth:         20px;
@gridRowWidth:            (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));

// 1200px min
@gridColumnWidth1200:     70px;
@gridGutterWidth1200:     30px;
@gridRowWidth1200:        (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1));

// 768px-979px
@gridColumnWidth768:      42px;
@gridGutterWidth768:      20px;
@gridRowWidth768:         (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1));


// Плавающая сетка
// -------------------------
@fluidGridColumnWidth:    percentage(@gridColumnWidth/@gridRowWidth); // wfedin
@fluidGridGutterWidth:    percentage(@gridGutterWidth/@gridRowWidth);

// 1200px min
@fluidGridColumnWidth1200:     percentage(@gridColumnWidth1200/@gridRowWidth1200); // wfedin
@fluidGridGutterWidth1200:     percentage(@gridGutterWidth1200/@gridRowWidth1200);

// 768px-979px
@fluidGridColumnWidth768:      percentage(@gridColumnWidth768/@gridRowWidth768); // wfedin
@fluidGridGutterWidth768:      percentage(@gridGutterWidth768/@gridRowWidth768);

<link rel="stylesheet/less" href="/path/to/bootstrap.less">
<script src="/path/to/less.js"></script>

<div class="wrapper container-fluid">
    <div class="row-fluid">
      <div class="span6">тест</div>
      <div class="span6">тест</div>
    </div>
  </div>

.row-fluid .span4 {
  width: 31.914893617021278%;
  *width: 31.861702127659576%;
}

.row-fluid .span4 {
  width: 31.914893617021%;
  *width: 31.86170212766%;
}

#grid > .fluid(@fluidGridColumnWidth1200, @fluidGridGutterWidth1200);

#grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768);

@import "variables.less"; // Modify this for custom colors, font-sizes, etc
@import "mixins.less";

#grid > .fluid(@fluidGridColumnWidth1200, @fluidGridGutterWidth1200);

#grid > .fluid(@fluidGridColumnWidth768, @fluidGridGutterWidth768);