title: Keith-Wood Datepick (month to a line)
body: <p>I want to use keith wood datepick as it is in the example :
  <a href="http://keith-wood.name/datepick.html?#layout" rel="nofollow">here</a></p>
  
  <p>the first one that draws a month in one line.</p>
  
  <pre><code>    &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html;charset=utf-8"&gt;
  &lt;title&gt;jQuery Datepicker&lt;/title&gt;
  &lt;style type="text/css"&gt;
  
      #listRender { font-size: 11px; }
      #listRender .month { clear: left; border: none;
          border-right: 1px solid #ccc; text-align: center; }
      #listRender .month div { float: left; width: 9.5em;
          padding-right: 0.5em; text-align: right; }
      #listRender ul { float: left; margin: 0em; padding: 0em;
          list-style: none; overflow: hidden; }
      #listRender ul.days { margin-left: 10em; text-align: center; }
      #listRender ul.days span { background-color: #777; color: #fff; }
      #listRender li { float: left; width: 1.75em; margin: 0em; border: 1px solid #aaa; }
      #listRender li a { display: block; width: 100%; padding: 0.125em;
          background-color: #eee; color: #000; text-decoration: none; }
      #listRender li span { display: block; width: 100%; padding: 0.125em;
          background-color: #fff; color: #888; }
      #listRender li .weekend { background-color: #ddd; }
      #listRender li .highlight { background-color: #f08080; }
      #listRender li .selected { background-color: #777; }
  &lt;/style&gt;
  &lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="jquery.datepick.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(function() {
  
          $('#inlineDatepicker').datepick({monthsToShow: [6, 1], showOtherMonths: true,
      onSelect: function(date) { alert('You picked ' + date); },
      renderer: {picker: '&lt;div&gt;&lt;ul class="days"&gt;' +
          '{weekHeader}{weekHeader}{weekHeader}{weekHeader}{weekHeader}{weekHeader}' +
          '&lt;/ul&gt;&lt;div&gt;{months}&lt;/div&gt;&lt;/div&gt;',
          monthRow: '&lt;div&gt;{months}&lt;/div&gt;',
          month: '&lt;div class="month"&gt;&lt;div&gt;{monthHeader:M yyyy}&lt;/div&gt;&lt;ul&gt;{weeks}&lt;/ul&gt;&lt;/div&gt;',
          weekHeader: '{days}',
          dayHeader: '&lt;li&gt;{day}&lt;/li&gt;',
          week: '{days}',
          day: '&lt;li&gt;{day}&lt;/li&gt;',
          monthSelector: '.month',
          daySelector: 'li',
          rtlClass: 'rtl',
          multiClass: 'multi',
          defaultClass: 'default',
          selectedClass: 'selected',
          highlightedClass: 'highlight',
          todayClass: 'today',
          otherMonthClass: 'other-month',
          weekendClass: 'weekend',
          commandClass: 'cmd-',
          disabledClass: 'disabled'}});
  
  });
  
  function showDate(date) {
      alert('The date chosen is ' + date);
  }
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;h1&gt;jQuery Datepicker&lt;/h1&gt;
  &lt;p&gt;This page demonstrates the very basics of the
      &lt;a href="http://keith-wood.name/datepick.html"&gt;jQuery Datepicker plugin&lt;/a&gt;.
      It contains the minimum requirements for using the plugin and
      can be used as the basis for your own experimentation.&lt;/p&gt;
  &lt;p&gt;For more detail see the &lt;a href="http://keith-wood.name/datepickRef.html"&gt;documentation reference&lt;/a&gt; page.&lt;/p&gt;
  &lt;p&gt;A popup datepicker &lt;input type="text" id="popupDatepicker"&gt;&lt;/p&gt;
  &lt;p&gt;Or inline&lt;/p&gt;
  &lt;div id="inlineDatepicker"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>any way, it does not work at all.
  it is perfect for my application. yet I can not make it work.
  where is the problem and how to fix it?
  regards</p>