Только вертикальные полосы прокрутки с div над вертикальным краем - PullRequest
Новая
       1

Только вертикальные полосы прокрутки с div над вертикальным краем

0 голосов
/ 13 января 2012

Я пытаюсь сделать список в HTML только с вертикальной полосой прокрутки.Я понимаю, как это сделать, но та часть, в которой я застрял, помещает div внутри элемента overflow'd по краям элемента overflow'd.

См. Код ниже: 

#wrapper {margin: 50px; width: 500px; height: 500px;}
#scrollable {width: 200px; height: 500px; overflow-y: visible; overflow-x: hidden;}
.item {clear: left; width: 200px; height: 40px;}

<body>
  <div id='wrapper'>
    <div id='scrollable'>
      <div class='item'></div>
      <div class='item'></div>
    </div>
  </div>
</body>

Я хочу, чтобы элементы .item проходили 5 или 10 пикселей по левому краю # scrollable.

Может кто-нибудь показать мне, как это сделать?

Спасибо.

Ответы [ 2 ]

0 голосов
/ 13 января 2012

Таким образом, как уже говорили другие, вы не можете показывать элементы вне границ элемента, у которого переполнение не является "видимым".

Однако, если вы просто пытаетесь добиться эффектаВы можете сделать это легко.Одним из способов было бы, если ваш #scrollable элемент должен быть 200px, то сделать каждый .item 190px по ширине и сместить на 10px влево.В противном случае, если вы .items должны иметь ширину 200px, тогда сделайте ваш #scrollable элемент 210px для компенсации.Затем при выделении смещение влево на 0.

Я сделал с ним JSFiddle.Взгляните (JS в нем не нужен, но просто имитирует выделение) http://jsfiddle.net/rgthree/tpfLZ/

0 голосов
/ 13 января 2012

В #wrapper добавьте: overflow: visible;
В #scrollable добавьте: margin-left: -10px; (вам может потребоваться установить ширину: 210 пикселей для компенсации)

Проверьте, чтобы убедиться, что это делает то, что вы ищете. (Обратите внимание, что это сделает элементы> 200px обрезанными вправо)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...