Вообщем, тренируюсь в верстке, есть небольшое понимание как верстать. Но в первые столкнулся с такой проблемой, что тег отталкивает тег . Может я упустил что-то? А так же буду не против, если вы укажите на ошибки которые имеются.
Код:
<div class="wrapper">
<header>
<h1 class="logo">MARBLE</h1>
<ul class="navigation">
<li><a href="#" class="active">HOME</a></li>
<li><a href="#">ABOUT</a></li>
<li><a href="#">JOURNAL</a></li>
<li><a href="#">SERVICE</a></li>
<li><a href="#">FEATURES</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</header>
<div class="slider">
<h2>We are a digital & branding agency based in London</h2>
<p>We love to turn great ideas into beautiful products.</p>
</div>
</div>
CSS:
body {
padding: 0;
margin: 0;
}
/*HEADER*/
header {
margin: 0 auto;
width: 1170px;
height: 123px;
background: #e7e7e7;
}
/*LOGO*/
.logo {
font: bold 40px 'Roboto Condensed';
line-height: 123px;
margin-left: 200px;
color: #4e4e4e;
}
/*MENU*/
.navigation {
list-style-type: none;
position: absolute;
top: 40px;
left: 740px;
}
.navigation li {
float: left;
margin-right: 21px;
font-family: 'Roboto Condensed', sans-serif;
font-weight: bold;
font-size: 14px;
text-align: right;
}
.navigation li a {
display: block;
font-size: 16px;
color: #4e4e4e;
text-decoration: none;
}
.navigation li a:hover {
color: #1abb9c;
}
/*SLIDER*/
.slider {
margin: 0 auto;
background: url(img/Layer%201.png);
width: 1170px;
height: 600px;
}