html - 如何使滚动条与文本对齐？

Question

在下面的小提琴中，滚动条位于小提琴的顶部。我需要滚动条与文本的第一个元素处于同一水平，但还要将滚动条垂直向下移动 40 像素。

http://jsfiddle.net/ebLSe/7/

是否有一个 css 选项可以将滚动条与自身对齐？

小提琴代码：

    <div class="scroll">
    <table  >
      <tr><td>
        test
        </tr></td>
        <tr><td>
        test
        </tr></td>
        <tr><td>
        test
        </tr></td>
        <tr><td>
        test
        </tr></td>
      </table>
    </div>

   .scroll {
    height: 80px;
    overflow-y:scroll;
}

.modeDown {
  padding-top: 100px;
}

Answer 1

您的文本位于 div 下方，因为您已经给出.scroll了40px. 如果您更改此值，您的文本将进一步向上移动 div。您可能还需要更改高度，因为此时您的 div 的高度为 80 像素（40 像素高度加上 40 像素填充）。

要将 div 保持在页面下方，您需要添加margin-top:40px到.scroll或您可以将其放入额外的 div 中，顶部填充为 40px

.scroll {
    margin-top:40px;
    height: 80px;
    overflow-y: scroll;
}