Сетка на 15 колонок getbotstrap 3

Можно использовать с обычными col
пример использования:

css код сетки на 15 колонок:

.col15-xs-1, .col15-sm-1, .col15-md-1, .col15-lg-1, .col15-xs-2, .col15-sm-2, .col15-md-2, .col15-lg-2, .col15-xs-3, .col15-sm-3, .col15-md-3, .col15-lg-3, .col15-xs-4, .col15-sm-4, .col15-md-4, .col15-lg-4, .col15-xs-5, .col15-sm-5, .col15-md-5, .col15-lg-5, .col15-xs-6, .col15-sm-6, .col15-md-6, .col15-lg-6, .col15-xs-7, .col15-sm-7, .col15-md-7, .col15-lg-7, .col15-xs-8, .col15-sm-8, .col15-md-8, .col15-lg-8, .col15-xs-9, .col15-sm-9, .col15-md-9, .col15-lg-9, .col15-xs-10, .col15-sm-10, .col15-md-10, .col15-lg-10, .col15-xs-11, .col15-sm-11, .col15-md-11, .col15-lg-11, .col15-xs-12, .col15-sm-12, .col15-md-12, .col15-lg-12, .col15-xs-13, .col15-sm-13, .col15-md-13, .col15-lg-13, .col15-xs-14, .col15-sm-14, .col15-md-14, .col15-lg-14, .col15-xs-15, .col15-sm-15, .col15-md-15, .col15-lg-15 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
.col15-xs-1, .col15-xs-2, .col15-xs-3, .col15-xs-4, .col15-xs-5, .col15-xs-6, .col15-xs-7, .col15-xs-8, .col15-xs-9, .col15-xs-10, .col15-xs-11, .col15-xs-12, .col15-xs-13, .col15-xs-14, .col15-xs-15 {
  float: left;
}
.col15-xs-15 {
  width: 100%;
}
.col15-xs-14 {
  width: 93.33333333%;
}
.col15-xs-13 {
  width: 86.66666667%;
}
.col15-xs-12 {
  width: 80%;
}
.col15-xs-11 {
  width: 73.33333333%;
}
.col15-xs-10 {
  width: 66.66666667%;
}
.col15-xs-9 {
  width: 60%;
}
.col15-xs-8 {
  width: 53.33333333%;
}
.col15-xs-7 {
  width: 46.66666667%;
}
.col15-xs-6 {
  width: 40%;
}
.col15-xs-5 {
  width: 33.33333333%;
}
.col15-xs-4 {
  width: 26.66666667%;
}
.col15-xs-3 {
  width: 20%;
}
.col15-xs-2 {
  width: 13.33333333%;
}
.col15-xs-1 {
  width: 6.66666667%;
}
.col15-xs-pull-15 {
  right: 100%;
}
.col15-xs-pull-14 {
  right: 93.33333333%;
}
.col15-xs-pull-13 {
  right: 86.66666667%;
}
.col15-xs-pull-12 {
  right: 80%;
}
.col15-xs-pull-11 {
  right: 73.33333333%;
}
.col15-xs-pull-10 {
  right: 66.66666667%;
}
.col15-xs-pull-9 {
  right: 60%;
}
.col15-xs-pull-8 {
  right: 53.33333333%;
}
.col15-xs-pull-7 {
  right: 46.66666667%;
}
.col15-xs-pull-6 {
  right: 40%;
}
.col15-xs-pull-5 {
  right: 33.33333333%;
}
.col15-xs-pull-4 {
  right: 26.66666667%;
}
.col15-xs-pull-3 {
  right: 20%;
}
.col15-xs-pull-2 {
  right: 13.33333333%;
}
.col15-xs-pull-1 {
  right: 6.66666667%;
}
.col15-xs-pull-0 {
  right: 0%;
}
.col15-xs-push-15 {
  left: 100%;
}
.col15-xs-push-14 {
  left: 93.33333333%;
}
.col15-xs-push-13 {
  left: 86.66666667%;
}
.col15-xs-push-12 {
  left: 80%;
}
.col15-xs-push-11 {
  left: 73.33333333%;
}
.col15-xs-push-10 {
  left: 66.66666667%;
}
.col15-xs-push-9 {
  left: 60%;
}
.col15-xs-push-8 {
  left: 53.33333333%;
}
.col15-xs-push-7 {
  left: 46.66666667%;
}
.col15-xs-push-6 {
  left: 40%;
}
.col15-xs-push-5 {
  left: 33.33333333%;
}
.col15-xs-push-4 {
  left: 26.66666667%;
}
.col15-xs-push-3 {
  left: 20%;
}
.col15-xs-push-2 {
  left: 13.33333333%;
}
.col15-xs-push-1 {
  left: 6.66666667%;
}
.col15-xs-push-0 {
  left: 0%;
}
.col15-xs-offset-15 {
  margin-left: 100%;
}
.col15-xs-offset-14 {
  margin-left: 93.33333333%;
}
.col15-xs-offset-13 {
  margin-left: 86.66666667%;
}
.col15-xs-offset-12 {
  margin-left: 80%;
}
.col15-xs-offset-11 {
  margin-left: 73.33333333%;
}
.col15-xs-offset-10 {
  margin-left: 66.66666667%;
}
.col15-xs-offset-9 {
  margin-left: 60%;
}
.col15-xs-offset-8 {
  margin-left: 53.33333333%;
}
.col15-xs-offset-7 {
  margin-left: 46.66666667%;
}
.col15-xs-offset-6 {
  margin-left: 40%;
}
.col15-xs-offset-5 {
  margin-left: 33.33333333%;
}
.col15-xs-offset-4 {
  margin-left: 26.66666667%;
}
.col15-xs-offset-3 {
  margin-left: 20%;
}
.col15-xs-offset-2 {
  margin-left: 13.33333333%;
}
.col15-xs-offset-1 {
  margin-left: 6.66666667%;
}
.col15-xs-offset-0 {
  margin-left: 0%;
}
@media (min-width: 768px) {
  .col15-sm-1, .col15-sm-2, .col15-sm-3, .col15-sm-4, .col15-sm-5, .col15-sm-6, .col15-sm-7, .col15-sm-8, .col15-sm-9, .col15-sm-10, .col15-sm-11, .col15-sm-12, .col15-sm-13, .col15-sm-14, .col15-sm-15 {
    float: left;
  }
  .col15-sm-15 {
    width: 100%;
  }
  .col15-sm-14 {
    width: 93.33333333%;
  }
  .col15-sm-13 {
    width: 86.66666667%;
  }
  .col15-sm-12 {
    width: 80%;
  }
  .col15-sm-11 {
    width: 73.33333333%;
  }
  .col15-sm-10 {
    width: 66.66666667%;
  }
  .col15-sm-9 {
    width: 60%;
  }
  .col15-sm-8 {
    width: 53.33333333%;
  }
  .col15-sm-7 {
    width: 46.66666667%;
  }
  .col15-sm-6 {
    width: 40%;
  }
  .col15-sm-5 {
    width: 33.33333333%;
  }
  .col15-sm-4 {
    width: 26.66666667%;
  }
  .col15-sm-3 {
    width: 20%;
  }
  .col15-sm-2 {
    width: 13.33333333%;
  }
  .col15-sm-1 {
    width: 6.66666667%;
  }
  .col15-sm-pull-15 {
    right: 100%;
  }
  .col15-sm-pull-14 {
    right: 93.33333333%;
  }
  .col15-sm-pull-13 {
    right: 86.66666667%;
  }
  .col15-sm-pull-12 {
    right: 80%;
  }
  .col15-sm-pull-11 {
    right: 73.33333333%;
  }
  .col15-sm-pull-10 {
    right: 66.66666667%;
  }
  .col15-sm-pull-9 {
    right: 60%;
  }
  .col15-sm-pull-8 {
    right: 53.33333333%;
  }
  .col15-sm-pull-7 {
    right: 46.66666667%;
  }
  .col15-sm-pull-6 {
    right: 40%;
  }
  .col15-sm-pull-5 {
    right: 33.33333333%;
  }
  .col15-sm-pull-4 {
    right: 26.66666667%;
  }
  .col15-sm-pull-3 {
    right: 20%;
  }
  .col15-sm-pull-2 {
    right: 13.33333333%;
  }
  .col15-sm-pull-1 {
    right: 6.66666667%;
  }
  .col15-sm-pull-0 {
    right: 0%;
  }
  .col15-sm-push-15 {
    left: 100%;
  }
  .col15-sm-push-14 {
    left: 93.33333333%;
  }
  .col15-sm-push-13 {
    left: 86.66666667%;
  }
  .col15-sm-push-12 {
    left: 80%;
  }
  .col15-sm-push-11 {
    left: 73.33333333%;
  }
  .col15-sm-push-10 {
    left: 66.66666667%;
  }
  .col15-sm-push-9 {
    left: 60%;
  }
  .col15-sm-push-8 {
    left: 53.33333333%;
  }
  .col15-sm-push-7 {
    left: 46.66666667%;
  }
  .col15-sm-push-6 {
    left: 40%;
  }
  .col15-sm-push-5 {
    left: 33.33333333%;
  }
  .col15-sm-push-4 {
    left: 26.66666667%;
  }
  .col15-sm-push-3 {
    left: 20%;
  }
  .col15-sm-push-2 {
    left: 13.33333333%;
  }
  .col15-sm-push-1 {
    left: 6.66666667%;
  }
  .col15-sm-push-0 {
    left: 0%;
  }
  .col15-sm-offset-15 {
    margin-left: 100%;
  }
  .col15-sm-offset-14 {
    margin-left: 93.33333333%;
  }
  .col15-sm-offset-13 {
    margin-left: 86.66666667%;
  }
  .col15-sm-offset-12 {
    margin-left: 80%;
  }
  .col15-sm-offset-11 {
    margin-left: 73.33333333%;
  }
  .col15-sm-offset-10 {
    margin-left: 66.66666667%;
  }
  .col15-sm-offset-9 {
    margin-left: 60%;
  }
  .col15-sm-offset-8 {
    margin-left: 53.33333333%;
  }
  .col15-sm-offset-7 {
    margin-left: 46.66666667%;
  }
  .col15-sm-offset-6 {
    margin-left: 40%;
  }
  .col15-sm-offset-5 {
    margin-left: 33.33333333%;
  }
  .col15-sm-offset-4 {
    margin-left: 26.66666667%;
  }
  .col15-sm-offset-3 {
    margin-left: 20%;
  }
  .col15-sm-offset-2 {
    margin-left: 13.33333333%;
  }
  .col15-sm-offset-1 {
    margin-left: 6.66666667%;
  }
  .col15-sm-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 992px) {
  .col15-md-1, .col15-md-2, .col15-md-3, .col15-md-4, .col15-md-5, .col15-md-6, .col15-md-7, .col15-md-8, .col15-md-9, .col15-md-10, .col15-md-11, .col15-md-12, .col15-md-13, .col15-md-14, .col15-md-15 {
    float: left;
  }
  .col15-md-15 {
    width: 100%;
  }
  .col15-md-14 {
    width: 93.33333333%;
  }
  .col15-md-13 {
    width: 86.66666667%;
  }
  .col15-md-12 {
    width: 80%;
  }
  .col15-md-11 {
    width: 73.33333333%;
  }
  .col15-md-10 {
    width: 66.66666667%;
  }
  .col15-md-9 {
    width: 60%;
  }
  .col15-md-8 {
    width: 53.33333333%;
  }
  .col15-md-7 {
    width: 46.66666667%;
  }
  .col15-md-6 {
    width: 40%;
  }
  .col15-md-5 {
    width: 33.33333333%;
  }
  .col15-md-4 {
    width: 26.66666667%;
  }
  .col15-md-3 {
    width: 20%;
  }
  .col15-md-2 {
    width: 13.33333333%;
  }
  .col15-md-1 {
    width: 6.66666667%;
  }
  .col15-md-pull-15 {
    right: 100%;
  }
  .col15-md-pull-14 {
    right: 93.33333333%;
  }
  .col15-md-pull-13 {
    right: 86.66666667%;
  }
  .col15-md-pull-12 {
    right: 80%;
  }
  .col15-md-pull-11 {
    right: 73.33333333%;
  }
  .col15-md-pull-10 {
    right: 66.66666667%;
  }
  .col15-md-pull-9 {
    right: 60%;
  }
  .col15-md-pull-8 {
    right: 53.33333333%;
  }
  .col15-md-pull-7 {
    right: 46.66666667%;
  }
  .col15-md-pull-6 {
    right: 40%;
  }
  .col15-md-pull-5 {
    right: 33.33333333%;
  }
  .col15-md-pull-4 {
    right: 26.66666667%;
  }
  .col15-md-pull-3 {
    right: 20%;
  }
  .col15-md-pull-2 {
    right: 13.33333333%;
  }
  .col15-md-pull-1 {
    right: 6.66666667%;
  }
  .col15-md-pull-0 {
    right: 0%;
  }
  .col15-md-push-15 {
    left: 100%;
  }
  .col15-md-push-14 {
    left: 93.33333333%;
  }
  .col15-md-push-13 {
    left: 86.66666667%;
  }
  .col15-md-push-12 {
    left: 80%;
  }
  .col15-md-push-11 {
    left: 73.33333333%;
  }
  .col15-md-push-10 {
    left: 66.66666667%;
  }
  .col15-md-push-9 {
    left: 60%;
  }
  .col15-md-push-8 {
    left: 53.33333333%;
  }
  .col15-md-push-7 {
    left: 46.66666667%;
  }
  .col15-md-push-6 {
    left: 40%;
  }
  .col15-md-push-5 {
    left: 33.33333333%;
  }
  .col15-md-push-4 {
    left: 26.66666667%;
  }
  .col15-md-push-3 {
    left: 20%;
  }
  .col15-md-push-2 {
    left: 13.33333333%;
  }
  .col15-md-push-1 {
    left: 6.66666667%;
  }
  .col15-md-push-0 {
    left: 0%;
  }
  .col15-md-offset-15 {
    margin-left: 100%;
  }
  .col15-md-offset-14 {
    margin-left: 93.33333333%;
  }
  .col15-md-offset-13 {
    margin-left: 86.66666667%;
  }
  .col15-md-offset-12 {
    margin-left: 80%;
  }
  .col15-md-offset-11 {
    margin-left: 73.33333333%;
  }
  .col15-md-offset-10 {
    margin-left: 66.66666667%;
  }
  .col15-md-offset-9 {
    margin-left: 60%;
  }
  .col15-md-offset-8 {
    margin-left: 53.33333333%;
  }
  .col15-md-offset-7 {
    margin-left: 46.66666667%;
  }
  .col15-md-offset-6 {
    margin-left: 40%;
  }
  .col15-md-offset-5 {
    margin-left: 33.33333333%;
  }
  .col15-md-offset-4 {
    margin-left: 26.66666667%;
  }
  .col15-md-offset-3 {
    margin-left: 20%;
  }
  .col15-md-offset-2 {
    margin-left: 13.33333333%;
  }
  .col15-md-offset-1 {
    margin-left: 6.66666667%;
  }
  .col15-md-offset-0 {
    margin-left: 0%;
  }
}
@media (min-width: 1200px) {
  .col15-lg-1, .col15-lg-2, .col15-lg-3, .col15-lg-4, .col15-lg-5, .col15-lg-6, .col15-lg-7, .col15-lg-8, .col15-lg-9, .col15-lg-10, .col15-lg-11, .col15-lg-12, .col15-lg-13, .col15-lg-14, .col15-lg-15 {
    float: left;
  }
  .col15-lg-15 {
    width: 100%;
  }
  .col15-lg-14 {
    width: 93.33333333%;
  }
  .col15-lg-13 {
    width: 86.66666667%;
  }
  .col15-lg-12 {
    width: 80%;
  }
  .col15-lg-11 {
    width: 73.33333333%;
  }
  .col15-lg-10 {
    width: 66.66666667%;
  }
  .col15-lg-9 {
    width: 60%;
  }
  .col15-lg-8 {
    width: 53.33333333%;
  }
  .col15-lg-7 {
    width: 46.66666667%;
  }
  .col15-lg-6 {
    width: 40%;
  }
  .col15-lg-5 {
    width: 33.33333333%;
  }
  .col15-lg-4 {
    width: 26.66666667%;
  }
  .col15-lg-3 {
    width: 20%;
  }
  .col15-lg-2 {
    width: 13.33333333%;
  }
  .col15-lg-1 {
    width: 6.66666667%;
  }
  .col15-lg-pull-15 {
    right: 100%;
  }
  .col15-lg-pull-14 {
    right: 93.33333333%;
  }
  .col15-lg-pull-13 {
    right: 86.66666667%;
  }
  .col15-lg-pull-12 {
    right: 80%;
  }
  .col15-lg-pull-11 {
    right: 73.33333333%;
  }
  .col15-lg-pull-10 {
    right: 66.66666667%;
  }
  .col15-lg-pull-9 {
    right: 60%;
  }
  .col15-lg-pull-8 {
    right: 53.33333333%;
  }
  .col15-lg-pull-7 {
    right: 46.66666667%;
  }
  .col15-lg-pull-6 {
    right: 40%;
  }
  .col15-lg-pull-5 {
    right: 33.33333333%;
  }
  .col15-lg-pull-4 {
    right: 26.66666667%;
  }
  .col15-lg-pull-3 {
    right: 20%;
  }
  .col15-lg-pull-2 {
    right: 13.33333333%;
  }
  .col15-lg-pull-1 {
    right: 6.66666667%;
  }
  .col15-lg-pull-0 {
    right: 0%;
  }
  .col15-lg-push-15 {
    left: 100%;
  }
  .col15-lg-push-14 {
    left: 93.33333333%;
  }
  .col15-lg-push-13 {
    left: 86.66666667%;
  }
  .col15-lg-push-12 {
    left: 80%;
  }
  .col15-lg-push-11 {
    left: 73.33333333%;
  }
  .col15-lg-push-10 {
    left: 66.66666667%;
  }
  .col15-lg-push-9 {
    left: 60%;
  }
  .col15-lg-push-8 {
    left: 53.33333333%;
  }
  .col15-lg-push-7 {
    left: 46.66666667%;
  }
  .col15-lg-push-6 {
    left: 40%;
  }
  .col15-lg-push-5 {
    left: 33.33333333%;
  }
  .col15-lg-push-4 {
    left: 26.66666667%;
  }
  .col15-lg-push-3 {
    left: 20%;
  }
  .col15-lg-push-2 {
    left: 13.33333333%;
  }
  .col15-lg-push-1 {
    left: 6.66666667%;
  }
  .col15-lg-push-0 {
    left: 0%;
  }
  .col15-lg-offset-15 {
    margin-left: 100%;
  }
  .col15-lg-offset-14 {
    margin-left: 93.33333333%;
  }
  .col15-lg-offset-13 {
    margin-left: 86.66666667%;
  }
  .col15-lg-offset-12 {
    margin-left: 80%;
  }
  .col15-lg-offset-11 {
    margin-left: 73.33333333%;
  }
  .col15-lg-offset-10 {
    margin-left: 66.66666667%;
  }
  .col15-lg-offset-9 {
    margin-left: 60%;
  }
  .col15-lg-offset-8 {
    margin-left: 53.33333333%;
  }
  .col15-lg-offset-7 {
    margin-left: 46.66666667%;
  }
  .col15-lg-offset-6 {
    margin-left: 40%;
  }
  .col15-lg-offset-5 {
    margin-left: 33.33333333%;
  }
  .col15-lg-offset-4 {
    margin-left: 26.66666667%;
  }
  .col15-lg-offset-3 {
    margin-left: 20%;
  }
  .col15-lg-offset-2 {
    margin-left: 13.33333333%;
  }
  .col15-lg-offset-1 {
    margin-left: 6.66666667%;
  }
  .col15-lg-offset-0 {
    margin-left: 0%;
  }
}


Отправить комментарий

Другие статьи рубрики "Сетки"