stop scroll-Leiste verdeckt, div-Inhalt mit overflow auto

Habe ich dieses div mit der overflow-y:auto; werden kann, sehr schmal und wenn die Bildlaufleiste angezeigt wird, es kann viel oder alles von den div. Ich möchte die Bildlaufleiste angezeigt wird, die außerhalb des div-wie mit overflow:scroll; aber ich will nicht zu sehen, verblassten die Bildlaufleiste verwendet wird, wenn es keinen überlauf. Ich möchte auch nicht zu geben, die div-Breite als die Breite muss variabel sein. Diese jsfiddle veranschaulicht mein Problem, und hier ist der code:

   .auto {
            display:inline-block;
            border:1px solid green;
            height:70px; 
            overflow-y:auto; 
         }

<div class = "auto">
  <div>
    a<br>
    b<br>
    c<br>
    d<br>
  </div>
</div>
  • overflow-y und display: inline-block; macht keinen Sinn für mich
InformationsquelleAutor user2014429 | 2013-05-02
  1. 3

    Könnte dies eine Lösung sein: http://jsfiddle.net/ZUYVe/5/

    Grundsätzlich nutzt es einen wrapper enthalten, der scrollbar

    <div class="scroll">
  <div>a
    <br />b
    <br />c
    <br />d
    <br />
  </div>
</div>

    und lässt etwas Platz auf der rechten Seite für Sie:

    padding-right: 13px;

    Jedoch, da die Scrollbalken können variieren je nach OS, ich würde vorschlagen, für die Verwendung benutzerdefinierter Bildlaufleisten wie das jQuery-plugin.

    • Danke für den plugin-link.. ich denke, du hast mich falsch jsfiddle-link, dies ist der original-fiddle-version gepostet, dass ich
    • Oh, ich re-hab es, der link sollte nun richtig sein.
    • ich danke Ihnen sehr viel für die neue Geige.Eine tolle Lösung für mich. Ich werde es zu benutzen.
    InformationsquelleAutor Cedric Reichenbach
  2. 3

    Geben 18px Polsterung Recht .auto Klasse, es wird dir helfen. 

       .auto   {
       border:1px solid green;
       height:70px; 
       overflow-y:auto; 
       display:inline-block;
       padding-right:18px;
      }
    InformationsquelleAutor Kishan Patel
  3. 1

    fiddlefügen Sie eine min-width und max-width. auf diese Weise bleibt es variable

    • vielen Dank für die jsfiddle. es ist eine gute Lösung zum Teil, aber verkleinern, um 67% und die wieder bedeckt.
    • dann geben Sie es wie padding-right:5px; aber ist es wirklich gehen, um so einen kleinen div?
    • es kann so wenig wie 1 Buchstaben breit. unwahrscheinlich, aber möglich. Ich werde versuchen mit dem padding-right
    InformationsquelleAutor DiederikEEn
Schreibe einen Kommentar