2013-08-04 54 views
7

Zwischen Keeping the Footer Down & Full Browser Width Bars Ich bin 90% wo ich sein muss.
(Für den Link "Full Browser Width Bars" verwende ich "timd.mackey" s Lösung im Kommentarbereich)Doppelte Browser Bildlaufleiste w/Überlauf versteckt

So funktioniert alles gut außer für diese lästige Doppel-Scroll-Leiste. Klicken Sie auf den Link unten, um zu sehen, was ich meine.

Click this to See my Problem!

Überlauf-x: hidden auf dem Körper scheint sowohl meine Lösung und mein Problem.

Jede Hilfe wäre Super Cool von Ihnen.

Hoffentlich war dies klar.

Antwort

14

Versuchen Zugabe:

html { 
    overflow-y: hidden 
} 
+0

Ahh perfekt. Ich habe es vorher hinzugefügt, aber ich habe es zu html hinzugefügt, body {} – Varazi

+0

Wenn Sie es mit JS setzen möchten, verwenden Sie document.documentElement, um einen Verweis auf das HTML-Tag zu erhalten: https://developer.mozilla.org/en-US/docs/Web/API/Dokument/DokumentElement – Corkscreewe

3

Vielleicht Überlauf-y: auf Körper versteckt würde Ihnen helfen? oder noch besser verwenden nur Überlauf: versteckt; BTW auf Körper

body { overflow:hidden; } 

, wenn Sie nur binden Fußzeile unten auf der Seite möchten, verwenden Sie die absolute Positionierung und margin-bottom auf Containerblock

CSS

.container { margin-bottom:100px; } 
.footer { height:100px; position:absolute; left:0; bottom:0; } 

HTML

<html> 
    <body> 
    <div class="container"><!-- here's everything except footer --></div> 
    <div class="footer"></div> 
    </body> 
</html> 
+0

body {Überlauf: versteckt; } das hat mein Problem gelöst –

4

Eine andere Lösung, die funktionieren könnte (je nachdem, was Sie erreichen möchten), ist:

body { 
    height: 100vh; 
} 
+0

Danke, das hat für mich funktioniert –

3

Wenn das Problem aufgrund html, body { overflow-x: hidden;} dann versuchen Sie es mit html, body{height: 100%;} es funktionierte gut für mich.

Verwandte Themen