title: How can I vertically align text in my div
body: <p>This is doing my head in. I can't get my text to align vertically in my footer. The basic text is where I want it in the middle but the links to log in end up at the top of the footer. Also when I log in and have my other options display the text on the right of the footer doesn't display. Please help.</p>
  
  <p>Footer code:</p>
  
  <pre><code>    &lt;?php
          include ("Includes/closeDB.php");
      ?&gt;
          &lt;footer&gt;
              &lt;div class="footer-wrapper"&gt;&lt;/div&gt;
              &lt;div class="footer-wrapper"&gt;
                  &lt;div class="float-left"&gt;&lt;p id="social"&gt;Site Map&lt;/p&gt;&lt;/div&gt;
                  &lt;div id="login"&gt;
                              &lt;?php
                                  if (logged_on())
                          {
                              echo '&lt;li&gt;&lt;a href="/logoff.php"&gt;Sign out&lt;/a&gt;&lt;/li&gt;' . "\n";
                              echo '&lt;li&gt;&lt;a href="/addpage.php"&gt;Add&lt;/a&gt;&lt;/li&gt;' . "\n";
                              echo '&lt;li&gt;&lt;a href="/selectpagetoedit.php"&gt;Edit&lt;/a&gt;&lt;/li&gt;' . "\n";
                              echo '&lt;li&gt;&lt;a href="/deletepage.php"&gt;Delete&lt;/a&gt;&lt;/li&gt;' . "\n";
                              if (is_admin())
                              {
  
                              }
                          }
                          else
                          {
                              echo '&lt;li&gt;&lt;a href="/logon.php"&gt;Admin Log In&lt;/a&gt;&lt;/li&gt;' . "\n";
                          }
                          ?&gt;
  
                          &lt;?php if (logged_on()) {
                              echo "&lt;div class=\"welcomeMessage\"&gt;Welcome, &lt;strong&gt;{$_SESSION['username']}&lt;/strong&gt;&lt;/div&gt;\n";
                          } ?&gt;
                  &lt;/div&gt;
  
                  &lt;div class="float-right"&gt;&lt;p id="social"&gt;&amp;copy; Swing and Putt 2014&lt;/p&gt;&lt;/div&gt;
              &lt;/div&gt;
          &lt;/footer&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.float-left {
  float: left;
  color: #000000;
  text-align: left;
  padding-left: 10px;
  }
  
  .float-right {
  float: right;
  color: #000000;
  text-align: right;
  padding-right: 10px;
  }
  
  footer {
  clear: both;
  font-size: 12pt;
  height: 30px;
  margin-top: -30px; /* negative value of footer height */
  position: relative;
  background-color: #00BFFF;
  padding: 5px;
  }    
  
  footer .footer-wrapper {
  }
  
  /* login
  ----------------------------------------------------------*/
  #login {
  display: block;
  font-size: 12pt;
  font-family: Arial;
  float: left; 
  }
  
  #login a {
  margin-left: 10px;
  margin-right: 3px;
  padding: 2px 3px;
  text-decoration: none;
  }
  
  #login a.username {
  background: none;
  margin-left: 0px;
  text-decoration: underline;
  }
  
  #login ul {
  margin: 0;
  }
  
  #login li {
  display: inline;
  list-style: none;
  }
  </code></pre>
  
  <p>Hope that all makes sense. I'm struggling with PHP type stuff.</p>