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


Фиксация Контента
Автор Никита_Питер, 20 сент. 2016 23:30
В теме одно сообщение
#1
Отправлено 20 Сентябрь 2016 - 23:30
#2
Отправлено 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 анонимных