title: Placing HTML/CSS without moving other elements
body: <p>I'm trying to put a live chat button on the right side of a menu without moving the menu at all.. if i put it inside of the menu then the menu will try and use it as an item and if i put it above it will move the menu down, if i put it below it will not align it correctly even if i use padding.</p>
  
  <p>Can anyone tell me how to move around an element on a page freely without affecting other elements around it (i.e moving them)</p>
  
  <p>CSS</p>
  
  <pre class="lang-css prettyprint-override"><code>/*===== header =====*/ 
  #header .row-1 { height:110px; background:#0d0d0d; } 
  #header .row-1 .logo { position:relative; margin-right: 55px; padding:0px 0 0 0; float:left; } 
  #header .nav { float:right; } 
  #header .nav li { } 
  #header .nav li a { color:#727171; text-decoration:none; } 
  #header .nav li a:hover, 
  #header .nav li a.current { color:#fff; }
  </code></pre>