прижать блоки к сторонам (адаптивная верстка)

gordy

Мастер
Регистрация
25 Авг 2015
Сообщения
228
Реакции
32
подскажите как сделать сайт на всю страницу, а блоки прижать левый и правый к сторонам, правый - к правой стороне, левый к левой, а контент увеличить

вот собственно стили

PHP:
#wrapper {
    position: relative;
    background: #e8e8e8;
    max-width:1300px;
    margin: 0 auto;
    -webkit-box-shadow: 0 0 3px #CACACA;
       -moz-box-shadow: 0 0 3px #cacaca;
            box-shadow: 0 0 3px #CACACA;
}

content{
@media (min-width: 992px)
.col-lg-6 {
  -webkit-flex: 0 0 50%;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
max-width: 50%;
}
}

SLeft{
@media (min-width: 992px)
.col-lg-3 {
    -webkit-flex: 0 0 25%;
-ms-flex: 0 0 25%;
   flex: 0 0 25%;
  max-width: 25%;
}
}

SRight{
@media (min-width: 992px)
.col-lg-3 {
    -webkit-flex: 0 0 25%;
-ms-flex: 0 0 25%;
   flex: 0 0 25%;
  max-width: 25%;
}
}
 

Вложения

  • Снимок.PNG
    Снимок.PNG
    492,8 KB · Просмотры: 4
подскажите как сделать сайт на всю страницу, а блоки прижать левый и правый к сторонам, правый - к правой стороне, левый к левой, а контент увеличить

вот собственно стили

PHP:
#wrapper {
    position: relative;
    background: #e8e8e8;
    max-width:1300px;
    margin: 0 auto;
    -webkit-box-shadow: 0 0 3px #CACACA;
       -moz-box-shadow: 0 0 3px #cacaca;
            box-shadow: 0 0 3px #CACACA;
}

content{
@media (min-width: 992px)
.col-lg-6 {
  -webkit-flex: 0 0 50%;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
max-width: 50%;
}
}

SLeft{
@media (min-width: 992px)
.col-lg-3 {
    -webkit-flex: 0 0 25%;
-ms-flex: 0 0 25%;
   flex: 0 0 25%;
  max-width: 25%;
}
}

SRight{
@media (min-width: 992px)
.col-lg-3 {
    -webkit-flex: 0 0 25%;
-ms-flex: 0 0 25%;
   flex: 0 0 25%;
  max-width: 25%;
}
}
В #wrapper убрать max-wight: 1300 px
Все остальное выравнивать так, как вам хочется
 
Назад
Сверху