Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>So heres an example that works like you want, i believe <a href="http://jsfiddle.net/RshTE/" rel="nofollow">http://jsfiddle.net/RshTE/</a></p> <p>Only thing is that i believe that IE6 wont like this.. I dont like to support ie6 anyways.</p> <p><a href="http://jsfiddle.net/RshTE/" rel="nofollow">http://jsfiddle.net/RshTE/</a> there are couple other downsides to this code that are shown in the example.</p> <p>But, uh... Enjoy? :D</p> <p>I've never really had to do something like this so there might be a better way and i just dont know that.</p> <p>CSS:</p> <pre><code>#wrap { width: 600px; margin: 0px auto; border: 1px solid #e1e1e1; } #sidebar { float: right; width: 150px; border: 1px solid #e1e1e1; height: 220px; } .content-box { overflow: auto; /* Important part */ border: 1px solid #e1e1e1; } </code></pre> <p>HTML:</p> <pre><code>&lt;div id="wrap"&gt; &lt;div id="content"&gt; &lt;div id="sidebar"&gt;Sidebar&lt;/div&gt; &lt;div class="content-box"&gt;Content box 1&lt;/div&gt; &lt;div class="content-box"&gt;Content box 2&lt;/div&gt; &lt;div class="content-box"&gt;Content box 3&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <hr> <p><strong>Edit:</strong> <a href="http://jsfiddle.net/RshTE/8/" rel="nofollow">http://jsfiddle.net/RshTE/8/</a> &amp; <a href="http://jsfiddle.net/RshTE/9/" rel="nofollow">http://jsfiddle.net/RshTE/9/</a> </p> <p>( Information about the <code>display: inline;</code> hack <a href="http://foohack.com/2007/11/cross-browser-support-for-inline-block-styling/" rel="nofollow">http://foohack.com/2007/11/cross-browser-support-for-inline-block-styling/</a> )</p>
    singulars
    1. This table or related slice is empty.
    1. POCSS blocks float question
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USJoonas
    1. USJoonas
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POCSS blocks float question
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTAcceptedByOriginator
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    1. COlooks approximately as I want it but you have only one DIV per line. If you reduce the width of "content-boxes" then problem repeats and the DIV under the right bar pushes all the below DIVs down
      singulars
      1. PO
      1. USlekso
    2. COCould you elaborate a little more? Im kinda lost in what you say. If you want to change the width of the content boxes isnt what pegel said just the way to go? And i just dont understand "you have only one div per line" i mean.. no one will be able to see the content if you fit dozen content boxes to a height of one line.. so isnt one enough? i started thinking about what you said about the width.. and i have no idea .. but i made this http://jsfiddle.net/RshTE/3/
      singulars
      1. PO
      1. USJoonas
    3. COit is about "content-box" class in your example, make its width 100px and you'll see what I mean. Also, there is a proposal from user pegel above. He added an image which approximately shows how the divs should be placed next to each other. Though in his example if he would add one more content div then it would go to third line and I want to put it on the right in the second line.
      singulars
      1. PO
      1. USlekso
 

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