title: Organizing lists in HTML/CSS
body: <p>I have a list and I need two sections in each item. I also need the first section to be of fixed width. How should I code it?</p>
  
  <p>I've tried using definition lists:</p>
  
  <pre><code>    &lt;dl&gt;
        &lt;dt style="width: 2em;"&gt;foo&lt;/dt&gt;&lt;dd&gt;bar&lt;/dd&gt;
      ...
  
      &lt;/dl&gt;
  </code></pre>
  
  <p>... and user lists with span:</p>
  
  <pre><code>    &lt;ul&gt;
        &lt;li&gt;&lt;span style="width: 2em;"&gt;foo&lt;span&gt;bar&lt;/li&gt;
      ...
  
      &lt;/ul&gt;
  </code></pre>
  
  <p>Neither worked. Are there any canonical ways to do that?</p>