Having trouble with my header element and nav not floating to the right using "float: right;"
Just dipping my toes into html&CSS, seeking assistance to make my nav bar float to the right. I've watched a few videos and checked out Stack Overflow, but can't pinpoint the issue. Started by referencing resources like Bootstrap, W3, and other sites.
Snippet of my code:
*,
html,
body {
margin: 0;
padding: 0;
}
header {
background-color: deepskyblue;
}
ul {
list-style: none;
}
ul li {
display: inline-block;
}
header nav {
float: right 1;
}
header nav ul li a {
padding-right: 30px;
font-weight: bold;
color: white;
transition: all 0.5s ease-in-out;
}<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<header>
<div class="container">
<div class="row">
<nav>
<ul>
<li><a href="">Home</a></li>
<li><a href="">Work</a></li>
<li><a href="">Services</a></li>
<li><a href="">Clients</a></li>
<li><a href="">Our Team</a></li>
<li><a href="">Contact</a></li>
</ul>
</nav>
</div>
<p>Some text here.</p>
</div>
</header>