Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>This was tested in IE and Firefox - both handle padding a little differently, so I am using height and width to account for content visibility.</p> <p>It makes sense to have 2 containers - one for the container and one for the content, however since browsers handle padding differently, it's a lot harder than you think to push the scrollbar into the hidden area. This is where the third container comes in:</p> <ul> <li>One container for the parent dimensions without scrollbars</li> <li>One container that contains the scrollbar which is pushed into the hidden area</li> <li>One container that houses the content with the correct width set</li> </ul> <p>This is accomplished through stylesheet tricks - the stylesheet has been commented so you can follow the instructions / comments in there.</p> <p>Hope this helps! :)</p> <pre><code>&lt;html&gt; &lt;head&gt; &lt;style type="text/css"&gt; /* Propetary paragraph style */ p { padding: 0px; margin: 0px 0px 7px 0px; } /* Global notes: - Since the /* This is the outer container - set desired height and width here */ .scrollabelDivContainer { width: 300px; height: 100px; padding: 0px; margin: 0px; overflow: hidden; border: 2px dashed #ddd; } /* This is the div inside the container - the height should match the container and width be more (to push the scrollbar into the hidden content area) */ .scrollableDiv { width: 400px; height: 100px; padding: 0px; margin: 0px; overflow-x: hidden; overflow-y: scroll; } /* This houses the content. Set the widget 10px less than the container width to ensure the content is visible in all browsers */ .scrollableDivContent { width: 290px; padding: 0px; margin: 0px; overflow: auto; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="scrollabelDivContainer"&gt; &lt;div class="scrollableDiv"&gt; &lt;div class="scrollableDivContent"&gt; &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tincidunt consequat urna ut tincidunt. Vestibulum molestie leo quis dui malesuada vulputate eget tempor purus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Cras nec orci enim, vel tristique lectus. Sed lobortis ultrices enim eu consequat.&lt;/p&gt; &lt;p&gt;Integer magna lectus, iaculis sit amet interdum nec, ullamcorper ut purus. Sed aliquam sollicitudin lacinia. Proin porttitor aliquet lorem, eu dictum lorem suscipit et. Ut vestibulum eros quis turpis auctor id sollicitudin risus faucibus. Quisque volutpat nibh ut sem euismod rutrum. Ut eget orci non quam scelerisque laoreet sit amet a metus. Mauris aliquam facilisis lacinia.&lt;p&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. POUsing jQuery to hide div scrollbar, but retain scrolling?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. This table or related slice is empty.
    1. USStephan Robberts
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload