I am having trouble trying to put my buttons next to my navigation bar

Question

first post and relatively new to programming, I am having trouble with trying to get my buttons further up the page and next to my side navigation bar, please view picture and code:

HTML:

 <nav>
        <ul>
               <li> <a href="index.html">Home</a></li>
               <li> <a href="news.html">News</a></li>
               <li> <a href="events.html">Events</a></li>
               <li> <a href="galleries.html">Galleries</a></li>
               <li> <a href="videos.html">Videos </a></li>
               <li> <a href="history.html">History</a></li>
               <li><a href="contact.html"> Contact</a></li>
           </ul>    
      </nav>    



      <a id="bigthumbnailone" href="news.html">New Website Launched!</a>          
      <a id="bigthumbnailtwo" href="news.html">Next Major: i49 </a>

CSS:

* {
margin:0px;
padding:0px;
  }

  a:link {
text-decoration:none;
color:#0099FF;
  }

  a:hover {
color:#0066FF;
font-weight:bold;
   }

  a:visited {
text-decoration:none;
color:#0099FF;
   }


  nav ul li {
display:;
margin:1px;
padding:30px;
list-style-type: none;
font-family:Segoe UI Light;
font-size:30px;
  }


 /*end navigation*/

 #bigthumbnailone {
display:block;
width:600px;
height:300px;
text-decoration:none;
text-align:left;
font-family:Segoe UI Light;
font-size:25px;
background-image:url(../images/thumbnails/messi.png);
outline-style:solid;
outline-color:#0099FF;
margin: 0 auto;
 }

  #bigthumbnailtwo {
display:block;
width:600px;
height:300px;
text-decoration:none;
text-align:left;
font-family:Segoe UI Light;
font-size:25px;
background-image:url(../images/thumbnails/messi.png);
outline-style:solid;
outline-color:#0099FF;
margin: 0 auto;
  }

What will I need to add to make sure my navigation bar and buttons can both be next to each other?

Answer 1

I would add a div around your buttons, and then float: left your nav and the div that surrounds the buttons.