title: Lining up elements on CSS dropdown
body: <p>How would I line up my dropdown elements with the <strong>clicker</strong>?</p>
  
  <p>Here is my CSS code</p>
  
  <pre><code>#header_dropdown {
      float: right;
  }
  .click-nav {
      width: 200px;
  }
  .click-nav ul {
      position: relative;
  }
  .click-nav ul li {
      position: relative;
      list-style: none;
      cursor: pointer;
  }
  .click-nav ul li ul {
      position: absolute;
  }
  .click-nav ul .clicker {
      position: relative;
      background: #2284B5;
      color: #FFF;
  }
  .click-nav ul .clicker:hover, .click-nav ul .active {
      background: #196F9A;
  }
  .click-nav ul li a {
      transition: background-color 0.2s ease-in-out;
      -webkit-transition: background-color 0.2s ease-in-out;
      -moz-transition: background-color 0.2s ease-in-out;
      display: block;
      background: #FFF;
      color: #333;
      text-decoration: none;
  }
  .click-nav ul li a:hover {
      background: #F2F2F2;
  }
  /* Fallbacks */
   .click-nav .no-js ul {
      display: none;
  }
  .click-nav .no-js:hover ul {
      display: block;
  }
  </code></pre>
  
  <p>Jsfiddle at <a href="http://jsfiddle.net/KVrFM/" rel="nofollow">http://jsfiddle.net/KVrFM/</a></p>