Şimdi Ara

websitesi 100% olmama durumu hakkında

Bu Konudaki Kullanıcılar:
2 Misafir - 2 Masaüstü
5 sn
4
Cevap
0
Favori
960
Tıklama
Daha Fazla
İstatistik
  • Konu İstatistikleri Yükleniyor
0 oy
Öne Çıkar
Sayfa: 1
Giriş
Mesaj
  • Merhabalar,

    örnek bir çalışma üzerinde işlemler yapmaktayım problemim telefonlarda ve tabletlerde sayfa 100% olması gerekirken sola yaslı şekilde sağdan 25px kadar boşluk bulunmakta sizce bunun nedeni ne olabilir. windowslarda 100% tam ekran görünmekte. aşağıdaki resimlerde görüldüğü üzere.

    önerileriniz için teşekkürler
     websitesi 100% olmama durumu hakkında







  • @media only screen and (min-width: 1025px) and (max-width: 1050px){ 
    #header,
    .nav-inner,
    .content-inner,
    .footer-inner,
    .header_bottom,
    .footer_bottom_inner{ width:980px; }
    .product-list .right{width:330px;}
    .category-info .images img{width:100%;}
    #footer .custom_footer_main{width:231px;}

    }
    @media only screen and (min-width: 980px) and (max-width: 1024px) {
    #header,
    .nav-inner,
    .content-inner,
    .footer-inner,
    .header_bottom,
    .footer_bottom_inner{ width:940px; }
    #column-left, #column-right { width:180px;}
    #column-left + #column-right + #content, #column-left + #content { margin-left: 190px; }
    #column-right + #content { margin-right: 190px; }
    #footer .column{ width:224px; }
    .nav-responsive , .toggle .mobile_togglemenu{display:none}
    #footer .column {width: 220px;}
    .category-info .images img{width:100%;}

    }
    @media only screen and (max-width: 979px){

    #header,
    .nav-inner,
    .content-inner,
    .footer-inner,
    .header_bottom,
    .footer_bottom_inner{ width:724px; }
    #column-left{ width:165px;}
    #column-right { display:none;}

    #column-left + #column-right + #content,
    #column-left + #content { margin-left: 175px; }
    #column-right + #content { margin-right: 0; }

    #column-left .banner img,
    #column-right .banner img{ max-width:100%}
    #header .header-right{ width:455px; }
    #header #search{ margin-left:-15px;margin-top:5px;}

    #footer .column { width:100%;margin:0;}
    #footer .column ul { display:none;padding-bottom:20px; }
    .nav-responsive {display:block}
    .product-info .cart span{ display:none;}
    .product-info .cart .links{ margin-top:8px;display: block; }
    .product-info .cart .links .product_wishlist { display:inline; background:url("../images/pipe.gif") no-repeat scroll right center; margin-right: 5px;
    padding-right: 7px;}
    .contact-info .right iframe{ width:100% !important; }
    .checkout-content .left , .checkout-content .right{width:100%; }
    .product-info .review a.review-write{ display:block; }
    select[name="category_id"]{clear:both; display:block; width:175px; margin:10px 0; }
    .product-list .right{width:350px;}
    #footer-container{background:#F7F4ED;}
    .category-info .images img{width:100%;}
    }

    /* Landscape phone to portrait tablet */
    @media only screen and (max-width: 767px) {

    #header,
    .nav-inner,
    .content-inner,
    .footer-inner,
    .header_bottom,
    .footer_bottom_inner{ width:auto; margin:0 15px; }

    #header .header_top{display:block;}
    #column-left,#column-right { display:none;}

    #column-left + #column-right + #content,
    #column-left + #content { margin-left:0; }

    #column-right + #content { margin-right: 0; }
    #content{ clear:both; width:100%;}

    #header .header-left , #header .header-right{ width:100%; }
    .header-left{ margin-top:10px; }
    #header #logo img{ display:block; text-align:center; margin:0 auto; }
    #header #welcome{ float: none;
    margin: 39px auto 0;
    text-align: center;
    width: 100%;}
    #header #search { width:97%; margin:15px auto; z-index:5; }
    #header .button-search{right:8px;}
    #header #search input{ width:100%; }
    #header #cart{ width:100%; top:155px; text-align:center; }
    #header #cart .heading a{background:url(../images/cart.png) no-repeat scroll left center transparent;padding:10px 0 10px 40px;}
    #header #cart .heading h4{ display:none; }
    #currency , #language , #currency .show:hover, #language .show:hover{ color: #FFFFFF;}
    #language{border-radius:5px 0 0 0;}
    #currency{border-radius:0 0 0 0;right:32%;}

    #currency , #language , .tm_headerlinkmenu{ width:33% !important; background-color:#A1CE41;
    border-right: 1px solid #FFFFFF;
    margin: -1px 0 0 0;
    padding: 10px 0;
    text-align: center; position:absolute; z-index:999; cursor:pointer;top:10px;}
    #header #cart .heading{ float:none;background:none;padding:0;}
    #header #cart .content{ margin:7px auto 0; float:none; }
    .language_div, .currency_div{ top:37px; }
    #header .links , #header .header_links{ display:none; }
    .header_bottom .links{display:none;}
    .header_bottom{background:none;height:10px;border:none;}
    #header .header_links{ background: none repeat scroll 0 0 #fff;
    display: none;
    position: absolute;
    margin: 0;
    padding: 0;
    width:170px;
    z-index: 95;
    top:40px; right:0;
    border:1px solid #F4F1E7; }
    #header .header_links li {
    border-bottom: 1px solid #F4F1E7;
    list-style: none outside none;
    text-align: left;
    }
    #header .header_links li a{
    display: block;
    padding: 5px 10px;
    }
    #header .header_links li a:hover {
    text-decoration: none;
    }
    #currency .show a , #currency .show a:hover, #language .show a , #language .show a:hover{ color:#fff;}
    .tm_headerlinkmenu {
    border-right: none !important;
    color: #FFFFFF;
    display: block;
    float:right;
    position:absolute;
    z-index:999;
    width:34% !important;
    margin-right: -4px;
    border-radius:0 5px 0 0;
    margin-top:0;
    right:0;
    }
    #currency .top_downarrow, #language .top_downarrow{background:url("../images/arrow-down-resp.png") no-repeat scroll right 7px;}
    #currency.active .top_downarrow, #language.active .top_downarrow{background:url("../images/arrow-up-resp.png") no-repeat scroll right 7px;}

    .copyright-container{ margin:10px auto; }
    .product-info > .left{ width:285px; margin:0 auto 10px; float:none; }
    .product-info > .left + .right{ margin-left:0; }
    .product-filter .limit{ float:none;margin-left:0; }
    .product-filter .display{ padding-top:0; }
    .zoomContainer .zoomLens{cursor:default !important ; }
    .zoomWindowContainer , .zoomWindow , .zoomContainer{ display:none; }
    .cart-left-area , .cart-right-area , .login-content .left , .login-content .right , .contact-info .left , .contact-info .right{ width:100%; }
    .login-content .left .content, .login-content .right .content{ min-height:inherit; }
    .captch_input , .cart-module input[type="text"]{ margin-bottom:6px !important; }
    .compare-info{ display: block; overflow: auto; width: 100%; }
    #colorbox , #cboxOverlay{ display:none !important;}
    #header #logo{margin-top:60px;}
    .flexslider{margin:10px 0;}
    }

    /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
    @media only screen and (min-width: 480px) and (max-width: 767px) {}

    /* Landscape phones and down */
    @media only screen and (max-width: 479px) {
    .tm_responsive_row label{ width:100%; margin-bottom:5px; }
    .tm_responsive_row span{ width:100%; }
    .language_label , .currency_label{ display:none; }
    .product-filter .sort{ margin-top:5px; float:left;}
    .product-compare{ clear:both; }
    .pagination .links{ float:none; }
    .htabs{ width:100%; height: auto; }
    .htabs a{ display: block !important; float: none; width:auto; margin:0; }
    table.form td{ width:100%; display:block; }

    .form input.large-field, .form select.large-field ,textarea, select, input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"]{ width:98%; }

    .sitemap-info .right , .sitemap-info .left , .manufacturer-list ul { width:100%; }
    .order-list .order-content div{ width:100%; margin-bottom:15px; text-align:left;}
    table#order-detail .left{ display:block;}
    .product-info .images-additional a{ float:none; text-align:center; }
    #header #search{width:95%;}
    .product-info > .left{width:275px;}
    }

    /* Mobile Landscape Size to Mobile Portrait (devices and browsers) */
    @media only screen and (min-width: 320px) and (max-width: 479px) { }
    @media only screen and (max-width: 319px){
    .mini-cart-info .name{ display:none; }
    .product-info > .left , #header #logo img , .product-info > .left .images img{ width:100%; }
    .product-info .cart .links .product_wishlist{ background:none; display:block;}
    .product-info .images-additional{ width:159px; margin:0 auto; }
    .product-info .product-images .customNavigation{ width:186px; margin:0 auto; position: relative; }
    .contact-info{ padding: 15px 10px;}
    #content .aboutus .images1 , #content .aboutus .images2 ,#content .aboutus .images3 ,#content .aboutus .images4{ float:none; }
    #content .aboutus .content{ padding:10px 0 0 0; }
    #order-detail3 table.list .left{ padding:5px;}
    #header #cart .content{ width:190px;}
    #header #search{width:93%;}
    table.list .left{display:block;}
    }
    @media only screen and (max-width:240px) {
    #header #search{width:91%;}
    }




  • Teşekkürler ismailix fakat kaynak kodlarında baktığımızda width:100% olarak gözükmekte, sistem tablolarla yapıldı divlerle değil; nedenini bulamadım gitti
  • tablo yada div fark etmez diye düşünüyorum.

    <table class="class ismi">
    </tabel>

    %100 vermek yerine her tarayıcı ekranına göre boyutlandırma yapmak gerekiyor.

    gönderdiğim css kodlarında bu var zaten.

    http://opencart-demos.org/OPC04/OPC040084/index.php?route=common/home
    sana kodunu gönderdim site linki yukarda.
  • 
Sayfa: 1
- x
Bildirim
mesajınız kopyalandı (ctrl+v) yapıştırmak istediğiniz yere yapıştırabilirsiniz.