Kaydırma çubuğum tarayıcının sağ tarafına gitmiyor mu?

CSS/HTML için yeni bir tercihim. Bir okul projesi için yanıt vermeyen bir 1140px web sitesi yapmak zorunda kaldım. Ben her iki tarafta koyu gri bir renk olmasını istedim 1140px beyaz bir arka plan rengine sahip (tarayıcı ortasında) olmasını istedim karar verdi.Kaydırma çubuğum tarayıcının sağ tarafına gitmiyor mu?

Bu yüzden html'ye koyu gri bir renk ve 1140 piksellik bir genişlikle vücuduma beyaz bir renk koyuyor. Ben html üzerine "taşma: gizli" koymam gerekiyordu ya da vücudun beyaz arka plan rengini göstermiyordu. Ama sorun şu ki, bu gizli taşma nedeniyle tarayıcımın en sağındaki kaydırma çubuğu benim vücudumun sağında değil. Benim sorunun

Ekran Görüntüsü:

http://i68.tinypic.com/hvxjdj.png

html { 
    background-color: rgb(50,50,50); 
    overflow: hidden; 
} 

body { 
    line-height: 1; 
    width: 1140px; 
    margin: 0 auto; 
    background-color: white; 
    overflow: auto; 
    box-shadow:0px 0px 20px #000000; 
}

taşma gizli özellik sağa benim kaydırma çubuğunu taşımak ve görmezden bir yolu var mı? Veya aynı arka plan sonucuna sahip olmanın başka bir yolu?

kaynak

2016-03-26 Sarah Van Den Berghe

yardımcı olabilecek snippet'idir? Bizi buraya anlattığınızdan başka bir şey olmalı, çünkü eğer bilginizle [bir keman] (https://jsfiddle.net/MrLister/8m6w3876/1/) yaparsam, pencerenin sağ kenarı. –

Genellikle, html etiketini çok fazla şekillendirmekten kaçınmalısınız. Çoğu durumda, HTML etiketi, tarayıcılar tarafından ayrı bir blok öğesi olarak görülmez. Açıkçası burada, HTML etiketinin taşma bildirimini kaldırmanız ve istediğiniz şeyi yapılandırmanız için daha iyi bir yol bulmanız gerekiyor ... sadece beden, sonra içeriğinizin bir div. – Scott

Gerçekten de sen Bay Lister haklısın, sorun başka bir şey vardı bu yüzden bütün CSS'ime baktım bu kod vardı: html, body { min-height: 100%; yükseklik: 100%; } Bunu sildim ve iyi çalıştı. Bana başka bir şey sorun olabileceğini farketmedin! Gelecekte başka bir şekilde deneyeceğim, bunun için yeni ama herşeyi hatırlayacağım, teşekkürler Scott! –

html'nizdeki overflow:hidden'u kaldırın ve gövde genişliğinizi% 100 yapın ve arka plan rengini saydam hale getirin. Bu size tam koyu gri bir sayfa verecektir (HTMl zaten greay bckground'a sahiptir). Şimdi vücudun içine bir div ekleyin ve arkaplan rengini beyaza ayarlayın. Ayrıca divanızı bir kenar boşluğu ve kenar boşluğu sağlayarak merkeze yerleştirin, Tüm içeriğinizi bu div'a koyun. Thats, Şimdi tarayıcının en sağında bulunan kaydırma çubuğuna sahip olacaksınız. Eğer bir parçacığını veya sorunu gösteren bir jsfiddle falan yapabilir İşte size

html{ 
 
    background-color:grey; 
 
} 
 

 
body{ 
 
    width:100%; 
 
    height:auto; 
 
    background-color:transparent; 
 
} 
 

 
.appContainer{ 
 
    margin: 0px 40px 0px 40px; 
 
    background-color:white; 
 
    height:2000px; 
 
}

<body> 
 
<div class="appContainer"> 
 
    
 
</div> 
 
</body>

kaynak

2016-03-26 19:04:38

Ah teşekkürler! Bir dahaki sefere bu şekilde yapacağım, bunu yapmanın doğru yolunu bilmiyordum :) –

@SarahVanDenBerghe Bu çözüm sorununuzu çözmenize yardımcı olduysa, lütfen bunu cevap olarak işaretleyin, Gelecekte izleyiciler için yararlı olabileceğinden –

Kaydırma çubuğum tarayıcının sağ tarafına gitmiyor mu?

cevap

İlgili konular