Перейти к содержимому


Фиксация Контента


  • Авторизуйтесь для ответа в теме
В теме одно сообщение

#1 Никита_Питер

Никита_Питер

    Пользователь

  • Пользователи
  • PipPip
  • 20 сообщений
  • Городград на Неве

Отправлено 20 Сентябрь 2016 - 23:30

При уменьшении браузера, весь контент начинает прыгать, пытаясь остаться на виду... Хотелось бы сделать, что бы он не прыгал, а был зафиксирован при уменьшении окна браузера, как например у вас на storeland.ru

Прикрепленные изображения

  • Безымянный8888888888.png


#2 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 21 Сентябрь 2016 - 02:27

В main.css найдите:
body {
	position: relative;
	font-family: Tahoma, sans-serif;
	font-size: 14px;
	line-height: 1.3;
	font-weight: 300;
	background-color: #FFFFFF;
	color: #22121e;
	overflow-x: hidden;
	margin: 0;
	padding: 0;
}

замените на:
body {
	position: relative;
	font-family: Tahoma, sans-serif;
	font-size: 14px;
	line-height: 1.3;
	font-weight: 300;
	background-color: #FFFFFF;
	color: #22121e;
	overflow-x: hidden;
	margin: 0;
	padding: 0;
	min-width: 960px;
}

далее найдите:
/******************************************************************************
  Адаптивная часть
*******************************************************************************/
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12, .col-sms-1, .col-sms-2, .col-sms-3, .col-sms-4, .col-sms-5, .col-sms-6, .col-sms-7, .col-sms-8, .col-sms-9, .col-sms-10, .col-sms-11, .col-sms-12 {float:left;position:relative;min-height:1px;padding-left:15px;padding-right:15px}
.col-xs-12{width:100%}
.col-xs-11{width:91.66666667%}
.col-xs-10{width:83.33333333%}
.col-xs-9{width:75%}
.col-xs-8{width:66.66666667%}
.col-xs-7{width:58.33333333%}
.col-xs-6{width:50%}
.col-xs-5{width:41.66666667%}
.col-xs-4{width:33.33333333%}
.col-xs-3{width:25%}
.col-xs-2{width:16.66666667%}
.col-xs-1{width:8.33333333%}
@media all and (max-width: 1199px) {
#information {padding-bottom: 0;}
}
/*
@media all and (max-width: 991px) {
.toolbar.bottom .sort-by {display: none;}
.product-view .product-img-box {padding: 0;}
.col-left .block.catalog {display: none;}
.discount-box .content .image {margin-bottom: 15px;}
.quickview-wrap {display: none !important;}
.cart-ajax .cart-product .cart-product-img {display: block;float: none;margin: 0 auto 10px;height: auto;}
.categories {display: flex;justify-content: center;align-items: center;flex-wrap: wrap;text-align: center;}
.products-grid {display: flex;justify-content: center;align-items: center;flex-wrap: wrap;text-align: center;}
.product-view .product-shop .add-to-box .add-to-cart .button.quick {display: none;}
.product-view .product-shop {padding: 0;}
.product-tabs {padding-bottom: 30px;overflow: hidden;}
.product-tabs .tabs {display: none;}
.product-tabs .tab-content {padding: 5px 0 15px;overflow: hidden;}
.acctab {display: block;position: relative;overflow: hidden;font-size: 21px;font-weight: bold;color: #22121e;margin: 0;padding: 10px 0;text-transform: uppercase;clear: both;}
.acctab:hover {color: #8C2C29;}
.toggle-class {position: absolute;right: 0;width: 100%;height: 50%;cursor: pointer;}
.toggle-class:before {content: "\f067";font-family: FontAwesome;position: absolute;top: 5px;right: 0;font-size: 14px;font-weight: normal;}
.toggle-class.active:before {content: "\f068";}
.footer-middle .maps {display: none;}
.step li {padding: 10px;}
#producttabs .pdt-nav:before, #producttabs .pdt-nav:after {display: none;}
#mommenu {display: inline-block;}
#custommenu {display: none;}
.block.compare .title a .hide, .block.search .title a .hide, .block.cart .title a .hide {display: none;}
.block.cart .title .cart-count {position: absolute;font-size: 11px;line-height: 1;right: -5px;top: 5px;}
.block.compare .title .compare-count {position: absolute;font-size: 11px;line-height: 1;right: 5px;top: 5px;}
.block.compare .title i, .block.cart .title i, .block.search .title i {margin-right: 0;}
.block.callback .button {padding: 0 12px;}
.block.callback i {display: block;font-size: 20px;line-height: 34px;}
.block.callback .hide {display: none;}
#proposition h2.title {margin-bottom: 20px;}
#proposition .callback .button {padding: 0 15px;}
#news .item .date {float: none;margin: 0 auto 10px;}
#news .item .content {width: 100%;}
#footer .footer-top .col-md-3 {margin-bottom: 15px;}
#footer .footer-top .col-md-3:nth-child(3) {clear:both;}
.products-grid .item .item-inner {padding-bottom: 0;}
.products-grid .item .product-image {margin-bottom: 0;}
.products-grid .item .product-image .mask {display: none;}
.products-grid .item .product-image .actions {position: static;padding-top: 15px;}
.products-grid .item .product-image .actions .ratings {margin-bottom: 5px;opacity: 1;filter: alpha(opacity=100);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-webkit-transform: translate(0px,0px);-moz-transform: translate(0px,0px);-o-transform: translate(0px,0px);-ms-transform: translate(0px,0px);transform: translate(0px,0px);
-webkit-transition: all 0s ease;-moz-transition: all 0s ease;-o-transition: all 0s ease;-ms-transition: all 0s ease;transition: all 0s ease;}
.products-grid .item .product-image .actions .addtocart {margin-bottom: 10px;-webkit-transform: translate(0px,0px);-moz-transform: translate(0px,0px);-o-transform: translate(0px,0px);-ms-transform: translate(0px,0px);transform: translate(0px,0px);}
.products-grid .item .product-image .actions .add-to-links {margin-bottom: 10px;opacity: 1;filter: alpha(opacity=100);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
-webkit-transform: translate(0px,0px);-moz-transform: translate(0px,0px);-o-transform: translate(0px,0px);-ms-transform: translate(0px,0px);transform: translate(0px,0px);
-webkit-transition: all 0s ease;-moz-transition: all 0s ease;-o-transition: all 0s ease;-ms-transition: all 0s ease;transition: all 0s ease;}
.products-grid .item .product-shop {position: static;padding-top: 0;}
.products-grid .item .product-shop .attr-list {display: none;}
.quickview {display: none !important;}
#orders .callbackForm .button {margin-top: 20px;}
}
@media all and (max-width: 767px) {
.col-sms-12 {width: 100%;}
.col-sms-11 {width: 91.66666666666666%;}
.col-sms-10 {width: 83.33333333333334%;}
.col-sms-9 {width: 75%;}
.col-sms-8 {width: 66.66666666666666%;}
.col-sms-7 {width: 58.333333333333336%;}
.col-sms-6 {width: 50%;}
.col-sms-5 {width: 41.66666666666667%;}
.col-sms-4 {width: 33.33333333333333%;}
.col-sms-3 {width: 25%;}
.col-sms-2 {width: 16.666666666666664%;}
.col-sms-1 {width: 8.333333333333332%;}
.products-list .item .product-image {float: none;margin: 0 auto 20px;min-height: 50px;height: auto;line-height: 1;}
.products-grid .item .item-inner {margin: 0 auto;}
.goodsDataOpinionAddTable label {width: 100%;}
.goodsDataOpinionFormReset {width: 80px;}
.view-mode, .sort-by, .show-by {margin-bottom: 10px;}
.cart-ajax .cart-product {padding: 0;}
.cart-ajax .cart-txt {min-height: 200px;padding: 0;}
.cart-ajax .cart-txt .buttons {position: relative;margin-top: 20px;}
.step li {display: block;width: 100%;padding: 15px;}
.step li.step_done {border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
.wrapper {padding-top: 0 !important;}
.block.cart .dropdown-cart, .block.compare .dropdown-compare {display: none;}
#producttabs .pdt-nav {margin-bottom: 10px;}
#producttabs .pdt-nav > li span {padding: 6px 15px;}
#producttabs .navigation {display: block;position: relative;width: 80px;height: 30px;margin: 0 auto 20px;}
#proposition {padding: 30px 0 1px;}
#proposition .callback {padding: 30px 15px;}
#promotion {padding: 30px 0;background: #efefec;}
#promotion .promotion-description {max-width: 100%;text-align: center;}
#promotion .promotion-description .text_large {font-size: 36px;}
#promotion .promotion-description .text_medium {font-size: 28px;}
#promotion .promotion-description .text_small {font-size: 18px;}
#promotion .promotion-description .button {padding: 0 30px;}
.main-block h2.title {font-size: 40px;}
.main-block h3.title {font-size: 36px;}
#news .title {margin-bottom: 20px;}
#news .navigation {position: relative;margin: 0 auto 20px;width: 80px;height: 30px;}
#news .owl-controls .owl-buttons {display: none;}
#news .item {padding: 0;}
#customers .item .image {width: 100px;height: 100px;line-height: 100px;}
#customers .item .image img {width: 50px;}
#information .item .image {width: 100px;height: 100px;line-height: 100px;}
#information .item .image img {width: 50px;}
.block.callback {margin-left: 30px;}
#slideshow .slide {display: none;}
#slideshow img {display: block;}
#slideshow .text {top: 70%;right: 0;}
#slideshow .text .title {display: none;}
#slideshow .text .button {height: 40px;line-height: 34px;font-size: 16px;padding: 0 15px;}
#payment_services a {float: none;}
.cartTable thead {display: none;}
.cartTable tbody tr {display: block;margin-bottom: 30px;}
.cartTable tbody tr > td {display: block;width: 100%;margin-bottom: 1px;}
.cartTable tbody .inputText {width: 70px;}
.cartTable tbody .price.old-price {display: none;}
.cartTable tbody tr .title {float: left;display: inline-block;}
.cartTable tbody tr .cart-qty .title {line-height: 40px;}
.cartTable tbody tr.discounttr {margin-bottom: 1px;}
.cartTable tbody tr.discounttr td {background-color: #efefec;text-align: right;}
.cartTable tbody tr.discounttr .disc-name .num {display: inline-block;}
.cartTable tbody tr.discounttr td.hide {display: none;}
.cartTable tfoot tr {display: block;float: left;width: 100%;margin-bottom: 1px;}
.cartTable tfoot tr > td {display: block;float: left;width: 100%;}
.cartTable tfoot td.text-right > span:first-child {margin-right: 15px;float: left;}
.cartTable tfoot td.hide {display: none;}
.cartTable tfoot td.text-right span.TotalSum {display: inline-block;}
.cartTable .buttons .left {float: none !important;}
.cartTable .buttons .button {display: block;float: none !important;margin: 0 auto 10px;width: 100%;}
}

@media all and (max-width: 641px) {
.scroll {overflow-x: scroll;}
#producttabs .pdt-nav > li {display: block;float: none;}
#producttabs .pdt-nav > li span {border-left: 0;border-top: 1px solid #e5e5e5;}
#orders .callbackForm .callback-input {display: block;margin: 0 0 10px 0;}
#orders .callbackForm .button {margin-top: 20px;padding: 0 10px;font-size: 20px;}
#orders .name-error, #orders .phone-error {position: relative;text-align: center;}
#information {padding-bottom: 20px;}
#information .item .title {max-height: 60px;height: auto;}
.header-top .header-left {width: 100%;text-align: center;margin-bottom: 15px;}
.header-top .header-right {float: none;text-align: center;}
.header-top .block.menu .title {padding: 0 15px 0 0;}
.header-top .block.search #search_mini_form {margin: 0 15px 0 0;}
.compare-info .buttons .button {padding: 0 15px;font-size: 12px;}
}
@media all and (max-width: 481px) {
.col-smb-12 {width: 100%;}
.col-contact {margin-bottom: 20px;}
.owl-carousel .owl-item .item .item-inner {margin: 0 auto;}
.sort-by {line-height: 20px;}
.sort-by select {width: 100%;max-width: 100%;}
.toolbar.bottom .pages {position: absolute; right: 0;}
.goodsDataOpinionFormReset {width: auto;}
.CompareGoodsTableFilter {float: left;}
.CompareGoodsTableFilter span {float: left;width: 100%;}
.product-view .product-shop .goodsDataMainDiscountBlock i {font-size: 35px;}
.product-view .product-shop .goodsDataMainDiscountBlock span strong.br {display: block;}
.product-view .product-shop .product-name {text-align: center;}
.product-view .product-shop .ratings {display: block;width: 110px;height: 15px;margin: 0 auto 20px;}
.product-view .product-shop .add-to-box .wrap-qty .qty-set .quantity {max-width: 60px;}
.box-up-sell .title {text-align: center;margin-bottom: 10px;padding-bottom: 5px;border-bottom: 3px solid #22121e;}
.box-up-sell .title span {border: 0;}
.box-up-sell .navigation {display: block;float: none;width: 80px;height: 30px;margin: 0 auto;top: 0;}
.header-top .block.compare {display: none;}
#footer .footer-middle .block-contact {padding: 30px 15px;}
#information .item:after {display: none;}
.main-block {padding: 30px 0;}
.main-block h2.title {font-size: 36px;}
.main-block h3.title {font-size: 30px;}
.main-block h4.title {font-size: 24px;}
.main-block h5.title {font-size: 21px;}
.page-title h1 {font-size: 32px;}
#slideshow .text {padding-right: 5px;}
#slideshow .text .button {font-size: 14px;padding: 0 10px;}
}
*/
@media all and (min-width: 768px) {
.col-sm-12{width:100%}
.col-sm-11{width:91.66666667%}
.col-sm-10{width:83.33333333%}
.col-sm-9{width:75%}
.col-sm-8{width:66.66666667%}
.col-sm-7{width:58.33333333%}
.col-sm-6{width:50%}
.col-sm-5{width:41.66666667%}
.col-sm-4{width:33.33333333%}
.col-sm-3{width:25%}
.col-sm-2{width:16.66666667%}
.col-sm-1{width:8.33333333%}
.container {width: 750px;}
.index #header {position: absolute;width: 100%;top: 0;right: 0;left: 0;background-color: rgba(220, 220, 220, 0.5);}
.index #header .header-middle {background-color: transparent;}
#news .navigation {display: none;}
#news .owl-buttons .owl-prev, #news .owl-buttons .owl-next {position: absolute;cursor: pointer;display: block;width: 30px;height: 55px;top: 25%;text-indent: -999px;background: url('{ASSETS_IMAGES_PATH}arrow.png?design=sunrise') center no-repeat;overflow: hidden;}
#news .owl-buttons .owl-prev { background-position: -15px -33px;float: left;left: 15px;}
#news .owl-buttons .owl-next { background-position: -75px -33px;float: right;right: 15px;}
}
@media all and (min-width: 992px) {
.col-md-12{width:100%}
.col-md-11{width:91.66666667%}
.col-md-10{width:83.33333333%}
.col-md-9{width:75%}
.col-md-8{width:66.66666667%}
.col-md-7{width:58.33333333%}
.col-md-6{width:50%}
.col-md-5{width:41.66666667%}
.col-md-4{width:33.33333333%}
.col-md-3{width:25%}
.col-md-2{width:16.66666667%}
.col-md-1{width:8.33333333%}
.container {width: 990px;}
.product-tabs .tabs {display: block;text-align: center;margin: 0;padding: 0;list-style: none;}
.product-tabs .tabs li {display: inline-block;text-align: center;vertical-align: top;}
.product-tabs .tabs li a {display: block;position: relative;overflow: hidden;font-size: 16px;text-transform: uppercase;color: #a0a0a0;padding: 0 15px;margin: 0 -2px;line-height: 50px;font-weight: bold;}
.product-tabs .tabs li a.active, .product-tabs .tabs li a:hover {color: #22121e;}
.product-tabs .tabs li a:before, .product-tabs .tabs li a:after {content: '';position: absolute;bottom: 0;left: 50%;height: 3px;background: #22121e;width: 0;-webkit-transition: all 250ms ease;transition: all 250ms ease;}
.product-tabs .tabs li a:after {right: 50%;left: auto;}
.product-tabs .tabs li a.active:after, .product-tabs .tabs li:hover a:after, .product-tabs .tabs li a.active:before, .product-tabs .tabs li:hover a:before {width: 50%;}
.product-tabs .tab-content {padding: 20px 0 30px;overflow: hidden;border-top: 1px solid #e5e5e5;margin-top: -2px;}
.product-tabs .acctab {display: none;}
}
@media all and (min-width: 1200px) {
.col-lg-12{width:100%;}
.col-lg-11{width:91.66666667%}
.col-lg-10{width:83.33333333%}
.col-lg-9{width:75%}
.col-lg-8{width:66.66666667%}
.col-lg-7{width:58.33333333%}
.col-lg-6{width:50%}
.col-lg-5{width:41.66666667%}
.col-lg-4{width:33.33333333%}
.col-lg-3{width:25%}
.col-lg-2{width:16.66666667%}
.col-lg-1{width:8.33333333%}
.container {width: 1200px;}
}
/******************************************************************************
  Фиксы для браузеров
*******************************************************************************/

замените на:
.col-md-12{width:100%}
.col-md-11{width:91.66666667%}
.col-md-10{width:83.33333333%}
.col-md-9{width:75%}
.col-md-8{width:66.66666667%}
.col-md-7{width:58.33333333%}
.col-md-6{width:50%}
.col-md-5{width:41.66666667%}
.col-md-4{width:33.33333333%}
.col-md-3{width:25%}
.col-md-2{width:16.66666667%}
.col-md-1{width:8.33333333%}





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных