title: Unable to position nav-below below my content
body: <p>Somehow I can not position my navigation links to the next blog pages below my content.
  I tried everything i can think of (margin, patting etc) but the stupid thing just stays where it is - on the right hand side.
  (It probably is some kind of stupid beginners problem but i just don't get it - sorry !)</p>
  
  <p>Here is a <strong>link</strong> to.... <a href="http://sparschweinkiller.de" rel="nofollow">My website</a> </p>
  
  <p>This is how the <strong>navigation</strong> is declared in <strong>index.php</strong> (behind the loop):</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;?php get_header(); ?&gt;
  
  
  &lt;?php if (have_posts()) : ?&gt;
  &lt;div id="post-area"&gt;
  &lt;?php while (have_posts()) : the_post();  
      
      get_template_part( 'content', get_post_format() );
  
      
   endwhile; ?&gt;
      
      
  &lt;/div&gt;
  &lt;?php else : ?&gt;
  &lt;?php endif; ?&gt;
      
  &lt;div id="nav-below"&gt;
  &lt;div class="nav-previous"&gt;&lt;?php next_posts_link( __( '&amp;laquo; Older posts', 'twentyten' ) ); ?&gt;&lt;/div&gt;
  &lt;div class="nav-next"&gt;&lt;?php previous_posts_link( __( 'Newer posts &amp;raquo;', 'twentyten' ) ); ?&gt;&lt;/div&gt;
  &lt;/div&gt;    
   
  &lt;?php get_footer(); ?&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>And here is <strong>My CSS:</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="true">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/*  SOVROL8028155969EE    */
  
  /* colour styles : light  */
    body  { background: url(../images/light/bg.jpg) repeat #FFF;  font-size:12px; line-height:20px;  font-family: 'Droid Sans', sans-serif;   }
    #wrap { width:94%; margin-left:3%;}
    
  /* font styles */ 
    h1  { font-size:33px; line-height:35px; color:#000000; padding:0px; font-weight:bold; text-align:center;  text-transform: uppercase; padding-bottom:5px; padding-top:5px; }
    h2  { font-size:18px; line-height:23px; color:#000000; padding:0px; font-weight:bold; text-align:center;  text-transform: uppercase; padding-top:2px; }
    h3  { font-size:15px; line-height:25px; color:#858585; padding:0px; margin:0px; font-weight:normal;  }
    h4  { font-size:15px; line-height:25px; color:#000000; padding:0px; margin:0px; font-weight:normal; font-weight:bold;  } 
    h5  { font-size:13px; line-height:22px; color:#000000; padding:0px; margin:0px; font-weight:normal;  }
    h6  { font-size:12px; line-height:22px; color:#858585; padding:0px; margin:0px; font-weight:normal;  } 
    p   { font-size:12px; color:#000; line-height:19px; margin:0px; padding:0px; padding-top:0px; padding-bottom:0px; font-family:'Helvetica',Arial, Helvetica, sans-serif; }
  
  /* list Styles */
    ul  { padding:0px; margin:0; margin-left:0px; font-family:'Helvetica',Arial, Helvetica, sans-serif; margin-top:10px;   }
    ul li { font-size:12px; color:#858585; padding-left:10px; margin-bottom:7px; list-style:inside; list-style-type:square;}
    ol  { padding:0px; margin:0; margin-left:25px; font-family:'Helvetica',Arial, Helvetica, sans-serif; margin-top:10px;   }
    ol li { font-size:12px; color:#858585; padding-left:10px; margin-bottom:7px;  list-style-type: decimal; }
    hr  { background:url(../images/hr.jpg) top center no-repeat; border:0; outline:0; clear:both; height:10px;}
   
  /* link styles */ 
    a  {color:#d11112; text-decoration: none;} 
    a:visited  {color:#d11112; text-decoration: none;}
    a:hover   {color:#ff96a7 ; text-decoration: none;}
    a:active   {color:#444444; text-decoration: none;}
    a:focus   {outline-style: none;}   
    .moretext                 {color:#d11112; text-decoration: none;} 
    .moretext:hover     {color:#ff96a7; text-decoration: none;}
  
    h1 a { color:#000000; }
    h1 a:visited { color:#000000; }
    h2 a { color:#000000; }
    h2 a:visited { color:#000000; }
  
  /* header nav styles */ 
    header     { 
    width: 100%;
    height: 255px;   /* Bildhöhe  */
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    background-color: #FFF;
    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s; }
  
  header #logo img {
    display: block;
    max-width: 100%;
    height: auto;
  }
  header nav {
    display: inline-block;
    float: right;
  }
  header nav a {
    line-height: 105px;
    margin-left: 20px;
    color: #9fdbfc;
    font-weight: 700;
    font-size: 18px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  }
  header nav a:hover {
    color: white
  }
  
  header.smaller {
    height: 107px
  }
  header.smaller #logo {
    width: 180px;
    height: 127px;
  }
  header.smaller nav a {
    line-height: 75px
  }
  
  .header-social {
    
  }
  
  /* =Extras
  ---------- */
  .clearfix:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
  }
  
  
  
    #logo     { 
    text-align: center;  
    margin-left: auto; 
    margin-right: auto;   
    /* display: inline-block;   float: left; */
    width: 361px;
    height: 255px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
  
    }
  
  
    /* #nav      { width:100%; background:url(../images/light/bg-row.png) top left repeat-x; height:57px; overflow:hidden;   }
    #nav ul     { display: inline; list-style: none;  margin:0px; padding:0px; height:42px; line-height:42px; clear:both;   }
    #nav ul li    { float: left;  display: inline;  font-size: 12px; margin:0px; padding:0px;   }
    #nav ul li a    { display:block; height:42px; margin-right:20px; text-decoration:none; margin-top:10px;  }
    #nav ul li a:hover { }
     */
  
  /* footer styles */
    #footer-area      { width:100%; display:inline; float:left; padding-top:5px; margin-top:40px; clear:both; background:url(../images/light/bg-row.png) top left  repeat-x; }
    #footer-area .widget    { width:310px; margin-right:30px; padding-top:35px; display:inline; float:left; font-size:12px; color:#454545; line-height:18px; font-family:'Helvetica',Arial, Helvetica, sans-serif;  }
    #footer-area .widget h3   { color:#858585;}
    #footer-area .widget p     { color:#000;}
    #footer-area .widget ul    { margin-left:0px;}
    #footer-area .widget li    { color:#858585; }
    #footer-area .widget a   { color:#444444;}
    #footer-area .widget a:hover  { color:#000;}
    #footer-area .widget-copy  { width:280px; overflow:hidden; display:inline; float:left; margin-left:10px;} 
  
  /* copyright styles */ 
    #copyright { clear:both; width:100%; background:url(../images/light/bg-row.png) top left repeat-x; display:inline; float:left; margin-top:15px; margin-bottom:20px; }
    #copyright p { padding-top:50px; color:#4f5356; font-size:12px; }
    #copyright a  {color:#858585; text-decoration: none;} 
    #copyright a:hover  {color:#000000; text-decoration: underline;}
   
   
  /* post and page styles */ 
    .type-post     { width:770px; background:#FFF; /*border-right:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb;*/ margin-right:10px; margin-top:15px; display:inline; float:left; position:relative;  }
    .type-page     { width:770px; background:#FFF; border-right:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; margin-right:10px; margin-top:15px; display:inline; float:left; }
    .type-attachment    { width:770px; background:#FFF; border-right:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; margin-right:10px; margin-top:15px; display:inline; float:left; }
    .gridly-category    {  width:auto; background:#000; height:30px; overflow:hidden; left:0; margin-top:30px;}
    .gridly-category p   { position: absolute; margin:0; padding:0; line-height:30px; padding-left:20px; padding-right:40px; color:#fff; text-transform:uppercase;   }
    .gridly-category a   { color:#fff; text-transform:uppercase;}
    .gridly-category a:hover  { color:#ff96a7;}
    .gridly-copy     { width:710px; margin-left:auto; margin-right:auto; padding-top:20px; padding-bottom:20px; overflow:hidden }
    .gridly-date     { width:150px;  color:#8e8e8e; font-size:11px;}
    .size-full     { width:100%; height:inherit;}
  
    .gridly-image    { margin-top:7px; border:1px solid #;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;}
  
  .gridly-image-single    { margin-top:7px; border:1px solid #;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px; margin-left: auto; margin-right: auto;   text-align: center; }
  
    .contentbox               { margin-top: 4px; height: 105px;  }
  
    .contentbox-single        { margin-top: 30px; }
  /*  FUNKTIONIERT NICHT */
    .contentbox-single p   { font-size:12px; color:#000; line-height:20px; margin:0px; padding:4px;  font-family:'Helvetica',Arial, Helvetica, sans-serif; }
  
    .price            { margin-top: 7px; font-size:24px; color:#8e8e8e;  }
    .sparbutton               {  position:absolute; z-index:1; margin-left: 130px; margin-top: -25px;}
    .sparbutton-single        {   margin-left: auto; margin-right: auto; text-align:center; margin-bottom: 40 px; padding-top: 40px; clear:both; }
  
  img{border:1px solid #;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  }
  #logo  img   {border:0px solid #;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  }
  
  
  .relatedposts {margin-top: 40px; font-size: 12px; margin-left:auto; margin-right:auto; width:950px; }  
  
  .relatedthumb {margin: 5px 2px 0 2px; float: left; }  
  .relatedthumb a:hover {color:#ff96a7 ;}  
  
  
   .grenze {width:100%; background:url(../images/light/bg-row.png) top left repeat-x; display:inline; float:left; margin-top:15px; margin-bottom:20px; }
  
  
  
  
  /*
  aktuell                     ziel            höhe
  
  post breite 310         post breite 320     padding top 10
     bild                     bild            padding bottom 20
     text                   300 x 250         h2  23
      250
  rand 30 30              rand 10 10
  */
  /* post index styles */ 
  #post-area {
    width: 85%;
    margin-left: auto;
    margin-right: auto;
      padding-top: 300px;
      padding-bottom: 4em;
  }
  #post-single {
    width: 85%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 300px;
    
  }
  
  .nav-previous { padding-top: 30px;}
  
  /*
  #post-area #infinite-loader {
              position: absolute;
              bottom: 1px;
              width: 80%;
              text-align: center;
              padding-bottom: 2em;
          }
  */
  
    #post-area .post     { width:320px; background:#FFF; margin-top:10px; /* border-right:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; margin-right:10px; margin-top:10px;*/ position:relative;  }
    #post-area .post .gridly-copy   { width:300px; height:420px; margin-left:auto; margin-right:auto; padding-top:10px; paddingbottom:20px; overflow:hidden; clear:both;}
    #post-area .post .gridly-date   { width:150px;  color:#8e8e8e; font-size:11px;  border-bottom:1px dotted #cccccc; padding-bottom:0; padding-top:0; }
    #post-area .post .gridly-link   { width:150px; border-top:1px dotted #e8e8e8; color:#494e51;}
  
  /* single post nav styles */ 
    .post-nav    { width:40px;  float:right; /*margin-left:10px; margin-top:15px; */}
    .post-next a    { background:url(../images/btn-left.png) top left no-repeat; height:35px; width:35px; display:inline; float:left; text-indent:-9999px; }
    .post-next a:hover { background:url(../images/btn-left.png) top right no-repeat; height:35px; width:35px;}
    .post-prev a    { background:url(../images/btn-right.png) top left no-repeat; height:35px; width:35px; display:inline; float:left; clear:both; text-indent:-9999px;}
    .post-prev a:hover { background:url(../images/btn-right.png) top right no-repeat; height:35px; width:35px;}
  
  /* comment styles */
    .comments-area ol { list-style:none; margin:0; padding:0;  border-bottom:1px solid #8e8e8e; }
    .comments-area li { list-style:none; margin:0; padding:0; border-top:1px solid #8e8e8e; width:100%; clear:both; display:inline; float:left; margin-bottom:10px; padding:10px;  } 
    .avatar    { display:none;} 
    .reply    { display:none;}
    .comment-meta   { display:none;}
    .comment-author  { font-size:16px; font-weight:bold; font-family: 'Droid Sans', sans-serif; }
    #comment-form  { width:50%; }
    .text-input   { clear:both; border:1px solid #8e8e8e; margin-bottom:5px; width:90%; padding:7px; font-family:Arial, Helvetica, sans-serif; color:#555; font-size:12px;  }
    .comment-input   { clear:both; border:1px solid #8e8e8e; margin-bottom:5px; width:90%; padding:7px; font-family:Arial, Helvetica, sans-serif; color:#555; font-size:12px;  } 
    .comment-submit  { clear:both; width:120px; height:30px; line-height:25px; background:#e5e5e5; border:1px solid #8e8e8e;   }
  
  /* Additional and WordPress styles */
    .clear    { clear:both;}
    .aligncenter   { display: block; margin: 0 auto; }
    .alignleft  { float: left; margin-right:20px; margin-top:20px; margin-bottom:10px; }
    .alignright  { float: right; margin: 0 0 20px 20px; }
    .wp-caption  {  text-align: left; margin-top:5px; margin-bottom:5px; }
    .wp-caption-text  { margin-top:2px;  text-align:left; font-style:italic;  font-size:11px; color:#999; } 
    .sticky      {}
    .gallery-caption  {} 
    .bypostauthor   {}
    blockquote   { font-size:2em; line-height:23px; color:#000; margin-left:20px; border-left: 1px dotted #999; padding-left:25px; margin-top:15px; margin-bottom:15px; }
  /* end of css file */</code></pre>
  </div>
  </div>
  </p>
  
  <p>Thank you so much - I really appreciate any help.</p>