title: Css Sub menu needed to show on the left not on the right of the menu
body: <p>Hi i am currently building an asp.net Menu</p>
  
  <pre><code>     &lt;asp:Menu ID="NavigationMenu" runat="server"  EnableViewState="False" IncludeStyleBlock="False"&gt;
                  &lt;Items&gt;
                      &lt;asp:MenuItem NavigateUrl="~/ViewHeaders.aspx" Text="View Submissions"/&gt;
                      &lt;asp:MenuItem NavigateUrl="~/Imports.aspx" Text="Import"/&gt;
                      &lt;asp:MenuItem NavigateUrl="~/Submission.aspx" Text="Insert Submission"/&gt;
                      &lt;asp:MenuItem NavigateUrl="~/Reports.aspx" Text="Reports"/&gt;
                      &lt;asp:MenuItem NavigateUrl="~/Remittance.aspx" Text="Remittance" /&gt;
                      &lt;asp:MenuItem NavigateUrl="~/" Text="Maintenance" Selectable="False"  &gt;
                          &lt;asp:MenuItem NavigateUrl="~/ForeignBank.aspx" Text="Foreign Bank" /&gt;
                          &lt;asp:MenuItem NavigateUrl="~/ProfitsProducts.aspx" Text="Products" /&gt;
                          &lt;asp:MenuItem NavigateUrl="~/ProfitsTransactions.aspx" Text="Transactions" /&gt;
                          &lt;asp:MenuItem NavigateUrl="~/Units.aspx" Text="Units" /&gt;
                          &lt;asp:MenuItem NavigateUrl="~/Currency.aspx" Text="Currency Maintenance" /&gt;
                      &lt;/asp:MenuItem&gt;
                  &lt;/Items&gt;
              &lt;/asp:Menu&gt;
  </code></pre>
  
  <p>This is the css linked to it </p>
  
  <pre><code>    div.hideSkiplink
  {
      background-color:#3a4f63;
      width:100%;
  }
  div.menu
  {
      padding: 4px 0px 4px 8px;
      left: -170;
  
  }
  div.menu ul
  {
      list-style: none;
      margin: 0px;
      padding: 0px;
      width: auto;
  
  }
  div.menu ul li a, div.menu ul li a:visited
  {
      background-color: #FFF; /*680840*/
      border: 1px #4e667d solid;
      height: 20px;
      width: 170px;
      color: #000; /*FFF*/
      display: block;
      line-height: 1.35em;
      padding: 4px 20px;
      text-decoration: none;
      white-space: nowrap;
  }
  div.menu ul li a:hover
  {
      background-color: #680840;
      color: #FFF;
      text-decoration: none;
  }
  /*
  .selectedMenu
  {
      background-color: #680840 !important;
      color: #FFF !important;
      text-decoration: none !important;
  }
  */
  
  .menu a.static.selected 
  {
      background-color: #680840 !important;
      color: #FFF !important;
      text-decoration: none !important;
  }
  
  div.menu ul li a:active
  {
      background-color: #680840;
      color: #FFF;
      text-decoration: none;
  
  }
  </code></pre>
  
  <p>How cam  alter the css to be able to hover onto the menu and it goes to the left instead of the right.</p>
  
  <p>Thanks </p>