Вообщем начал верстать. В с body отступы по 0
вроде все должно быть ок. Но во всех следующих блоках откуда то берется (так понимаю маржин райт) который нигде не указывается.
Кто с подобным сталкивался спасайте)
вроде все должно быть ок. Но во всех следующих блоках откуда то берется (так понимаю маржин райт) который нигде не указывается.
Кто с подобным сталкивался спасайте)
HTML:
<body>
<div class="header clearfix">
<img src="img/1.png" alt="">
<pre>Жилой дом
Ярославская область
</pre>
<ul class="nav clearfix">
<li class="nav-item">
<a class="nav-link" href="#">Инфраструктура</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Планировки и цены</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Материалы и отделка</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Документы</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Контакты</a>
</li>
</ul>
<div class="telefon clearfix">
<p class="tel">+7(891)982-12-37</p>
<a href="#" class="button">Заказать звонок</a>
</div>
</div>
Код:
body{
margin: 0px;
padding: 0px;
background: #fff;
width: 1400px;
font-family: 'Roboto Slab', serif;
font-size: 1.0em;
color:black;
}
.header{
box-sizing: border-box;
padding: 15px 0px 15px 0px;
margin-left: 20px;
width: 1200px;
}
.header img{
width: 73px;
height: 73px;
float:left;
}
.nav{
float:left;
padding: 0;
padding-left: 10px;
}
.nav-link:hover{
border: none;
border-radius: 6px;
background: rgb(220, 225, 250);
}
.nav-link{
padding: 10px;
text-decoration: none;
color:rgb(0, 0, 0);
font-weight: 700;
transition: 0.5s;
}
.nav-item{
display: block;
float:left;
padding: 10px 0px;
}
.header pre{
float:left;
font-family: 'Roboto Slab', serif;
}
.clearfix:after{
content: "";
display: table;
clear: both;
}
.tel{
margin: 0px;
margin-bottom: 2px;
}
.telefon{
padding-left: 10px;
float:left;
margin: 2px auto;
}
.button{
float:left;
padding: 10px;
border: 2px solid rgb(163, 52, 193);
border-radius: 5px;
text-decoration: none;
color: rgb(0,0,0);
}