Не работает, float, по идее он должен прижать картинку, к правому краю, а чет не работает, код и скрин ниже
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Dart Service Manager</title>
<link rel="stylesheet" href="css/style.css">
<link href="https://fonts.googleapis.com/css?family=Raleway&display=swap" rel="stylesheet">
</head>
<body>
<header>
<div class="container">
<div class="div-logo">
<a href="index.html" style="text-decoration: none;"><img src="img/logo1.png" alt="logo">
<img src="img/logo.png" alt="logo"></a>
</div>
<nav>
<div class="div-button">
<form action="" method="">
<button class="sing_up">sign up</button>
</form>
</div>
<ul class="nav-ul">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#" style="color: #061e37;">Service</a>
</li>
<li>
<a href="#">Expension</a>
</li>
<li>
<a href="#">Pricing</a>
</li>
<li>
<a href="#">Help</a>
</li>
</ul>
</nav>
<div class="container-1">
<p class="header-text-1">Lorem ipsum <br />dolor sit amet</p>
<p class="header-text-2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo<br /> ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis<br /> dis parturient montes, nascetur ridiculus mus</p>
<form method="" action="" class="form1">
<button class="buy">buy now</button>
<button class="free">try for free</button>
</form>
</div>
<div class="container-3">
<img src="img/video1.png" alt="">
</div>
</div>
</header>
</body>
</html>
*
{
margin: 0;
padding: 0;
}
body
{
font-family: 'Raleway', sans-serif;
margin: 0;
padding: 0;
}
.container
{
width: 1450px;
margin: 0 auto;
}
header
{
background: no-repeat center / cover;
background-image: linear-gradient(to right, rgba(27, 232, 191, 0.7), rgba(16, 183, 205, 0.6)), url('../img/bg2.png');
height: 750px;
}
.div-logo
{
float: left;
margin-top: 41px;
}
nav
{
text-align: center;
padding-top: 64px;
}
.nav-ul
{
}
.nav-ul li
{
display: inline;
margin-right: 42px;
}
.nav-ul li a
{
text-decoration: none;
color: #FFF;
font-weight: bold;
font-size: 15px;
}
.sing_up
{
float: right;
}
header
{
margin: 0;
padding: 0;
}
.div-button
{
padding-top: 0px;
}
.sing_up
{
width: 80px;
height: 25px;
background-color: transparent;
border-radius: 3px;
border: 1px solid #FFF;
color: #FFF;
outline: none;
padding: 0px;
}
.header-text-1
{
text-transform: uppercase;
font-weight: bold;
font-size: 55px;
color: #FFF;
}
.container-1
{
margin-top: 176px;
float: left;
}
.header-text-2
{
font-size: 18px;
color: #FFF;
}
.form1
{
margin-top: 44px;
}
.buy
{
width: 143px;
height: 50px;
background-color: #061e37;
color: #FFF;
border: none;
border-radius: 4px;
text-transform: uppercase;
margin-right: 30px;
}
.free
{
width: 162px;
height: 50px;
color: #061e37;
background-color: #FFF;
border: none;
border-radius: 4px;
text-transform: uppercase;
font-weight: bold;
}
.container-3
{
float: right;
}