I'm trying to get the image in the body to expand across the full length of the screen like the header. I'm using codepen if that makes a difference. Thanks.
<header>
<title>Meghan's - Website</title>
</header>
<body>
<div class="header">
<div class="container">
<div class="logo">
<h1><a>Meghan</a></h1>
</div>
<div class="navigation">
<ul>
<li><a>Home</a></li>
<li><a>About</a></li>
<li><a>Portfolio</a></li>
<li><a>Contact</a><li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class+"content">
<img id="lav" src="https://media.licdn.com/media/AAEAAQAAAAAAAAspAAAAJDY4N2Y3Y2Q2LTdkMGQtNGVmNi04MTdkLWE2NWQ2NzJmNTU4Nw.jpg">
</div>
</div>
</body>
body{
width: 100%;
}
.header {
background: #E0E0E0;
width: 100%;
position: fixed;
opacity: 0.5;
}
.logo {
float: left;
font-family: palatino, arial, sans-serif;
padding-left: 30px;
}
a {
text-decoration: none;
color: #585858;
}
ul li {
list-style: none;
float: left;
font-size: 15px;
padding-left: 30px;
padding-top: 20px;
}
.navigation{
float: right;
}
.container{
width: 100%;
}
#lav {
padding-top: 68px;
width: 100%;
height: 600px;
}
