html - Move a nav which is inside a header to the right side -

i have nav inside header , wanted move nav right side of page. tried float:right not lined anymore header. here code:

<header> <nav>     <h1>my page</h1>     <ul>         <a href="#"><li>home</li></a>         <a href="#"><li>blog</li></a>         <a href="#"><li>about</li></a>         <a href="#"><li>contact</li></a>         <a href="#"><li>links</li></a>     </ul> </nav> 

header{ background:#999; color:white; padding:15px 15px 0 15px; }  header h1{ margin:0; display:inline; }  nav ul{  margin:0; display:inline; padding:0 0 0 15px; }  nav ul li{ background:black; color:white; display:inline-block; list-style:none; padding:5px 15px;  } 

all need add inline-block properties nav , header elements. add width:100% header full size. of course don't forget float:right nav.

also move h1 outside nav.

there correct code:

header{ background:#999; color:white; padding:15px 15px 0 15px; width:100%; }  header h1{ margin:0; display:inline; }  header, nav { display:inline-block; }  nav { float:right; }  nav ul{  margin:0; display:inline; padding:0 0 0 15px; }  nav ul li{ background:black; color:white; display:inline-block; list-style:none; padding:5px 15px;  }