Я вас правильно понял?)))
*,
*:before,
*:after {
box-sizing: border-box;
}
body {
font-family: sans-serif;
margin: 0;
}
html {
font-size: 10px;
}
.whaper {
width: 1280px;
margin: 0 auto;
border: 1px solid red;
}
.main {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
height: 80px;
position: relative;
}
.header {
height: 80px;
justify-content: space-between;
align-items: center;
display: flex;
width: 1280px;
padding: 0 20px 0 20px;/* вот тут отспуп */
}
.search-form {
display: inline-block;
/* Это включает позиционирование относительно <form>, */
/* а не относительно всей страницы */
position: relative;
}
.search-form-input {
width: 188px;
height: 32px;
line-height: 28px;
margin: 0;
padding: 0 38px 0 10px;
border: 2px solid #d5d5d5;
border-radius: 0;
background-color: white;
box-sizing: border-box;
font-family: Tahoma, sans-serif;
font-size: 13px;
}
.search-form-btn {
/* Позиционирование относительно <form> */
position: absolute;
right: 2px;
/* 2px - размер border'а поля формы */
top: 2px;
width: 28px;
height: 28px;
line-height: 28px;
/* Просто тюнинг внешнего вида */
color: #666;
font-weight: bold;
margin: 0;
padding: 0;
border: 0;
border-radius: 0;
background-color: transparent;
text-align: center;
cursor: pointer;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Aditii</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="whaper">
<div class="main">
<div class="header">
<div class="logo">
<h1>Aditii</h1>
</div>
<div class="search">
<form action="#" class="search-form">
<input type="search" class="search-form-input" placeholder="Search.." />
<button type="submit" class="search-form-btn">
<!-- Сюда можно запихнуть любую картинку на свой вкус -->
<img src="img/Search%201.png" alt="">
</button>
</form>
</div>
<div class="korzina">
<img src="https://cdn1.savepice.ru/uploads/2017/10/13/8a7753a627c0f71b8149eb94c44dd162-full.png" alt="">
<h2>$300</h2>
</div>
</div>
</div>
</div>
</body>
</html>