Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <h2><code>&gt;</code> selects immediate children</h2> <p>For example, if you have nested divs like such:</p> <pre><code>&lt;div class='outer'&gt; &lt;div class="middle"&gt; &lt;div class="inner"&gt;...&lt;/div&gt; &lt;/div&gt; &lt;div class="middle"&gt; &lt;div class="inner"&gt;...&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>and you declare a css rule in your stylesheet like such:</p> <pre><code>.outer &gt; div { ... } </code></pre> <p>your rules will apply only to those divs that have a class of "middle" since those divs are direct descendants (immediate children) of elements with class "outer" (unless, of course, you declare other, more specific rules overriding these rules). See fiddle.</p> <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code"> <pre class="snippet-code-css lang-css prettyprint-override"><code>div { border: 1px solid black; padding: 10px; } .outer &gt; div { border: 1px solid orange; }</code></pre> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class='outer'&gt; div.outer - This is the parent. &lt;div class="middle"&gt; div.middle - This is an immediate child of "outer". This will receive the orange border. &lt;div class="inner"&gt;div.inner - This is an immediate child of "middle". This will not receive the orange border.&lt;/div&gt; &lt;/div&gt; &lt;div class="middle"&gt; div.middle - This is an immediate child of "outer". This will receive the orange border. &lt;div class="inner"&gt;div.inner - This is an immediate child of "middle". This will not receive the orange border.&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;p&gt;Without Words&lt;/p&gt; &lt;div class='outer'&gt; &lt;div class="middle"&gt; &lt;div class="inner"&gt;...&lt;/div&gt; &lt;/div&gt; &lt;div class="middle"&gt; &lt;div class="inner"&gt;...&lt;/div&gt; &lt;/div&gt; &lt;/div&gt;</code></pre> </div> </div> </p> <h2>Side note</h2> <p>If you, instead, had a space <code></code> between selectors instead of <code>&gt;</code>, your rules would apply to both of the nested divs. The space is much more commonly used and defines a "descendant selector", which means it looks for any matching element down the tree rather than just immediate children as the <code>&gt;</code> does.</p> <p>NOTE: The <code>&gt;</code> selector is not supported by IE6. It does work in all other current browsers though, including IE7 and IE8.</p> <p>If you're looking into less-well-used CSS selectors, you may also want to look at <code>+</code>, <code>~</code>, and <code>[attr]</code> selectors, all of which can be very useful.</p> <p><a href="http://www.quirksmode.org/css/selectors/">This page</a> has a full list of all available selectors, along with details of their support in various browsers (its mainly IE that has problems), and good examples of their usage.</p>
    singulars
    1. This table or related slice is empty.
    1. POCSS '>' selector; what is it?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USGovind Rai
    1. USSpudley
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POCSS '>' selector; what is it?
      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. VTUpMod
    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. VTAcceptedByOriginator
    1. CO@JamWaffles - I've added more info, along with a link to Quirksmode.org which should help your research.
      singulars
      1. PO
      1. USSpudley
    2. CONeat! Thanks for the link. I already use the `[attr]` selector in a few of my projects. I'll look into `+` and `~` too.
      singulars
      1. PO
      1. USBojangles
    3. CO...and by 'current', he means every browser your visitors use... unless, of course, you don't have more than 2% of your users using IE6
      singulars
      1. PO
      1. USAdam Kiss
 

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