title: How to create an Hours of Operation list with HTML and CSS?
body: <p>I'm having trouble figuring out how to properly create a list for hours of operations using basic html and css. </p>
  
  <p>I trying to make 2 columns. On the left column is the day of the week (<code>text-align:right;</code>) and on the right is the Hours (<code>text-align:left;</code>) so that the right edge of the day and the left edge of the hours is aligned in the center.</p>
  
  <p>Is there a way to do this and keeping the 2 list items aligned to the center?</p>
  
  <p>Can this be done with a <code>&lt;dl&gt;</code> or 2 <code>&lt;ul&gt;</code> ?</p>
  
  <p>here is a visual <a href="http://screencast.com/t/ClyGI7Oqp" rel="nofollow">Example</a></p>
  
  <p>Right:</p>
  
  <pre><code>   Sunday: Closed
     Monday: 9am - 5pm
    Tuesday: 9am - 5pm
  Wednesday: 9am - 5pm
   Thursday: 9am - 5pm
  </code></pre>
  
  <p>Wrong:</p>
  
  <pre><code>Sunday: Closed
  Monday: 9am - 5pm
  Tuesday: 9am - 5pm
  Wednesday: 9am - 5pm
  Thursday: 9am - 5pm
  </code></pre>