Dreamweaver Fluid Grid and Twitter Bootstrap

Question

Does anyone know if it's possible to graft the Twitter Bootstrap styling, elements and functioning onto the Fluid Grid in Dreamweaver CS6? If so how?
I think it would be great to be able to have the ease of manipulating the rows and columns using the Fluid Grid and have all the cool styling and all from Twitter Bootstrap.

Answer 1

Here is the complete grid css file that I'm using. It is modified from the original bootstrap. Different class names. It's wrapped in a media query so that the grid only applies above 768px. It gives you a 12 grid system.
@media only screen and (min-width: 768px) {
/* Grids only applied to desktop and tablet
.col1,
.col2,
.col3,
.col4,
.col5,
.col6,
.col7,
.col8,
.col9,
.col10,
.col11,
.col12
    display: inline;
  float: left;
  width: 100%;
  min-height: 28px;
  margin-left: 2.127659574%;
  *margin-left: 2.0744680846382977%;
-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
          box-sizing: border-box;
.row [class*="col"]:first-child {
  margin-left: 0;
.row .col12 {
  width: 99.99999998999999%;
  *width: 99.94680850063828%;
.row .col11 {
  width: 91.489361693%;
  *width: 91.4361702036383%;
.row .col10 {
  width: 82.97872339599999%;
  *width: 82.92553190663828%;
.row .col9 {
  width: 74.468085099%;
  *width: 74.4148936096383%;
.row .col8 {
  width: 65.95744680199999%;
  *width: 65.90425531263828%;
.row .col7 {
  width: 57.446808505%;
  *width: 57.3936170156383%;
.row .col6 {
  width: 48.93617020799999%;
  *width: 48.88297871863829%;
.row .col5 {
  width: 40.425531911%;
  *width: 40.3723404216383%;
.row .col4 {
  width: 31.914893614%;
  *width: 31.8617021246383%;
.row .col3 {
  width: 23.404255317%;
  *width: 23.3510638276383%;
.row .col2 {
  width: 14.89361702%;
  *width: 14.8404255306383%;
.row .col1 {
  width: 6.382978723%;
  *width: 6.329787233638298%;
/* Prefix Extra Space >> 12 Columns
.prefix_1 {
    padding-left: 8.333%;
.prefix_2 {
    padding-left: 16.667%;
.prefix_3 {
    padding-left: 25.0%;
.prefix_4 {
    padding-left: 33.333%;
.prefix_5 {
    padding-left: 41.667%;
.prefix_6 {
    padding-left: 50.0%;
.prefix_7 {
    padding-left: 58.333%;
.prefix_8 {
    padding-left: 66.667%;
.prefix_9 {
    padding-left: 75.0%;
.prefix_10 {
    padding-left: 83.333%;
.prefix_11 {
    padding-left: 91.667%;
/* Suffix Extra Space >> 12 Columns
.suffix_1 {
    padding-right: 8.333%;
.suffix_2 {
    padding-right: 16.667%;
.suffix_3 {
    padding-right: 25.0%;
.suffix_4 {
    padding-right: 33.333%;
.suffix_5 {
    padding-right: 41.667%;
.suffix_6 {
    padding-right: 50.0%;
.suffix_7 {
    padding-right: 58.333%;
.suffix_8 {
    padding-right: 66.667%;
.suffix_9 {
    padding-right: 75.0%;
.suffix_10 {
    padding-right: 83.333%;
.suffix_11 {
    padding-right: 91.667%;
/* Push Space >> 12 Columns
.push_1 {
    left: 8.333%;
.push_2 {
    left: 16.667%;
.push_3 {
    left: 25.0%;
.push_4 {
    left: 33.333%;
.push_5 {
    left: 41.667%;
.push_6 {
    left: 50.0%;
.push_7 {
    left: 58.333%;
.push_8 {
    left: 66.667%;
.push_9 {
    left: 75.0%;
.push_10 {
    left: 83.333%;
.push_11 {
    left: 91.667%;
/* Pull Space >> 12 Columns
.pull_1 {
    left: -8.333%;
.pull_2 {
    left: -16.667%;
.pull_3 {
    left: -25.0%;
.pull_4 {
    left: -33.333%;
.pull_5 {
    left: -41.667%;
.pull_6 {
    left: -50.0%;
.pull_7 {
    left: -58.333%;
.pull_8 {
    left: -66.667%;
.pull_9 {
    left: -75.0%;
.pull_10 {
    left: -83.333%;
.pull_11 {
    left: -91.667%;
/* Clear Floated Elements
/* http://sonspring.com/journal/clearing-floats */
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-ha ck */
.row:before,
.row:after {
  display: table;
  line-height: 0;
  content: "";
.row:after {
  clear: both;
.row {
    display: inline-block;
* html .row {
    height: 1%;
.row {
    display: block;
.row .first {
    margin-left: 0;