Cześć, mam problem z małymi odstępami pomiędzy "krawędzią okna"(? jeśli można to tak nazwać) a div'em.
Dokładnie chodzi o lewą i górną stronę. Chciałbym się dowiedzieć dlaczego one powstały i jak się ich pozbyć.
W załączniku wysyłam zrzut ekranu jak to wygląda.
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<title>Templete</title>
<link rel="stylesheet" type="text/css" href="style/style.css">
<link href="https://fonts.googleapis.com/css?family=Didact+Gothic" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Arimo" rel="stylesheet">
</head>
<body>
<div class="left">
<h1>Lorem Ipsum</h1>
<h2>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet,
consectetur, adipisci velit...</h2>
</div>
<div class="right">
<p><center>Log in</center></p>
</div>
</body>
</html>
html
{
margin: 0;
padding: 0;
width: 100%;
}
body
{
background: url("https://i.imgur.com/BD4e0Hm.jpg") 50% 50% fixed;
background-size: cover;
}
h1
{
color: white;
font-family: 'Didact Gothic', sans-serif;
text-align: center;
font-size: 9vh;
margin-bottom: auto;
}
h2
{
color: white;
font-family: 'Arimo', sans-serif;
text-align: center;
font-size: 3vh;
margin-bottom: auto;
}
.left
{
position: absolute;
width: 65%;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
}
.right
{
position: absolute;
margin-left: 65%;
width: 35%;
height: 100%;
background-color: rgba(0,0,0, 0.6);
}