Deaktivieren Sie die vertikale Bildlaufleiste bei Div-Überlauf: Auto

113

Ist es möglich, bei Verwendung von Überlauf nur eine horizontale Bildlaufleiste zuzulassen: Auto (oder Bildlauf)?

— joedborg
quelle

Beachten Sie, dass margin-bottommit einem negativen Wert mit overflow-y: hiddenusw.

— Andrew

232

Diese beiden CSS-Eigenschaften können verwendet werden, um die Bildlaufleisten auszublenden:

overflow-y: hidden; // hide vertical
overflow-x: hidden; // hide horizontal

— Luke
quelle

@Coulton Was ist mit Safari und Chrom?

— QMaster

Nach dieser funktioniert es in Safari und ich weiß , dass es in Chrome funktioniert.

— Luke

3

Erwähnenswert ist, dass Sie immer noch mit div scrollen können tab, vorausgesetzt, es gibt Links oder Eingabeelemente im versteckten Überlauf

— William Brochmann

40

Sie sollten nur verwenden

overflow-y:hidden; - Verwenden Sie diese Option, um die vertikale Schriftrolle auszublenden

overflow-x:auto; - Verwenden Sie diese Option, um den horizontalen Bildlauf anzuzeigen

Luke hat beide als versteckt erwähnt. also habe ich dies separat angegeben.

— Siva Charan
quelle

21

Überlauf: auto;
Überlauf-y: versteckt;

Für IE8: -ms-overflow-y: versteckt;

Oder sonst:

So verstecken Sie X :

<div style="height:150x; width:450px; overflow-x:hidden; overflow-y: scroll; padding-bottom:10px;"></div>

So verstecken Sie Y :

<div style="height:150px; width:450px; overflow-x:scroll ; overflow-y: hidden; padding-bottom:10px;"></div>

— Zufälliger Typ
quelle

8

Wenn Sie dasselbe in Gecko (NS6 +, Mozilla usw.) und IE4 + gleichzeitig erreichen möchten, sollte dies meiner Meinung nach den Trick tun: V.

body {
overflow: -moz-scrollbars-vertical;
overflow-x: hidden;
overflow-y: auto;
}

Dies wird auf das gesamte Body-Tag angewendet. Bitte aktualisieren Sie es auf Ihr relevantes CSS und wenden Sie diese Eigenschaften an.

— Nirav Mehta
quelle

2

Fügen Sie Folgendes hinzu:

body{
overflow-y:hidden;
}

— Zeinab
quelle

1

Diese Regeln sind mit allen Browsern kompatibel:

body {overflow: hidden; }
body::-webkit-scrollbar { width: 0 !important; }
body { overflow: -moz-scrollbars-none; }
body { -ms-overflow-style: none; }

— Tamueka
quelle

1

Wie wäre es mit einer Kurzschreibweise?

{overflow: auto hidden;}

— Chong Lip Phang
quelle

0

Wenn Sie die Bildlaufleiste deaktivieren möchten, aber dennoch den Inhalt des inneren DIV scrollen können, verwenden Sie den folgenden Code in CSS.

.divHideScroll::-webkit-scrollbar {
    width: 0 !important
}
.divHideScroll {
    overflow: -moz-scrollbars-none;
}
.divHideScroll {
    -ms-overflow-style: none;
}

divHideScroll ist der Klassenname des Ziel-Div.

Es funktioniert in allen gängigen Browsern (Chrome, Safari, Mozilla, Opera und IE).

— Tahir Alvi
quelle