Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p><strong>8/29/2016 Edit</strong></p> <p>The original answer below is no longer functional in modern browsers. For those who still need to use a tag instead of doing magic with HTML lists, a better solution was found on this stackoverflow thread: <a href="https://stackoverflow.com/questions/1146789/rendering-a-hierarchy-of-options-in-a-select-tag">Rendering a hierarchy of &quot;OPTION&quot;s in a &quot;SELECT&quot; tag</a></p> <p>I would recommend the solution suggested by <a href="https://stackoverflow.com/users/1781849/igor-krupitsky">igor-krupitsky</a> who suggests dropping &amp;nbsp; and using the binary &amp;#160; instead. At least on Chrome, this does not break using the keyboard to find the first character of an item in the list.</p> <p><strong>End Edit</strong></p> <p>The current HTML specification does not provide for nested tags adding any functionality (such as indentation). See <a href="http://www.w3.org/TR/html401/interact/forms.html#h-17.6" rel="nofollow noreferrer">this link</a>.</p> <p>In the mean time, you can manually style your levels with CSS. I tried using styles in your sample, but for some reason they did not render correctly, so at the very least the following will work:</p> <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false"> <div class="snippet-code"> <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;select name="select_projects" id="select_projects"&gt; &lt;option value=""&gt;project.xml&lt;/option&gt; &lt;optgroup label="client1"&gt; &lt;option value=""&gt;project2.xml&lt;/option&gt; &lt;/optgroup&gt; &lt;optgroup label="client2"&gt; &lt;option value=""&gt;project5.xml&lt;/option&gt; &lt;option value=""&gt;project6.xml&lt;/option&gt; &lt;optgroup label="client2_a"&gt; &lt;option value="" style="margin-left:23px;"&gt;project7.xml&lt;/option&gt; &lt;option value="" style="margin-left:23px;"&gt;project8.xml&lt;/option&gt; &lt;/optgroup&gt; &lt;option value=""&gt;project3.xml&lt;/option&gt; &lt;option value=""&gt;project4.xml&lt;/option&gt; &lt;/optgroup&gt; &lt;option value=""&gt;project0.xml&lt;/option&gt; &lt;option value=""&gt;project1.xml&lt;/option&gt; &lt;/select&gt;</code></pre> </div> </div> </p> <p>Hope that helps.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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