Я делал практически все по туториалу и тут бац:/ Я хочу убрать верхние и боковые зазоры. Как это сделать? Если что load static это django python и в теге я использую иконочный шрифт.
@font-face {
font-family: 'iconfoont';
src: url('fonts/iconfoont.eot?lobagz');
src: url('fonts/iconfoont.eot?lobagz#iefix') format('embedded-opentype'),
url('fonts/iconfoont.ttf?lobagz') format('truetype'),
url('fonts/iconfoont.woff?lobagz') format('woff'),
url('fonts/iconfoont.svg?lobagz#iconfoont') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="icon-"], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'iconfoont' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-search:before {
content: "\e90a";
}
.icon-friendss:before {
content: "\e900";
}
.icon-chats:before {
content: "\e901";
}
.icon-friends:before {
content: "\e902";
}
.icon-chatss:before {
content: "\e903";
}
.icon-heart:before {
content: "\e904";
}
.icon-comment:before {
content: "\e905";
}
.icon-plane:before {
content: "\e906";
}
.icon-settings:before {
content: "\e907";
}
.icon-palette:before {
content: "\e908";
}
.icon-off:before {
content: "\e909";
}
body {
background: #1921FF;
}
li {
list-style-type: none;
display: inline;
}
#top1 {
float: top;
background: #2B2B2B;
weight: 100vh;
padding: 2,5%;
height: 12%;
color: #fff;
border-bottom: 3px solid #555555;
}
#searchline {
radius: 15%;
}
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Моя сот сеть</title>
<link rel="stylesheet" href="{% static 'myapp/style.css' %}">
</head>
<body>
<aside id="top1">
<form id="search">
<p><input id="searchline" type="search" name="q" placeholder="Поиск по сайту">
<input type="submit" value="Найти"></p>
</form>
<ul id="local">
<a><li><i class="icon-heart"></i></li></a>
<a><li><i class="icon-comment"></i></li></a>
<a><li><i class="icon-plane"></i></li></a>
</ul>
</aside>
<aside id="top2">
<button>все</button>
<button>чаты</button>
<button>посты</button>
<button>видео</button>
<button>изображения</button>
<button>аудио</button>
<button>реклама</button>
</aside>
<main>
</main>
</body>
</html>
float
не существует значенияtop
. Во-вторых, вам нужно всего лишь обнулить margin для элемента body