<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder
  xmlns:ui="urn:ui:com.google.gwt.uibinder">

  <ui:style>
    .viewport {
      position: relative;
      overflow: hidden;
    }

    .scrollable {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 100px;
      overflow: auto;
      overflow-x: scroll;
      overflow-y: hidden;
    }

    .content {
      height: 1px;
    }
  </ui:style>

  <!-- Viewport: reveals only the scrollbar from the scrollable div. -->
  <div
    class="{style.viewport}">

    <!-- Scrollable: a scrollable div. -->
    <div
      ui:field="scrollable"
      class="{style.scrollable}">

      <!-- Content: controls how far the div can be scrolled. -->
      <div
        ui:field="contentDiv"
        class="{style.content}" />
    </div>
  </div>
</ui:UiBinder>