<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<style>
* {box-sizing: border-box;}
body {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
}
.btn-search{
margin-left: -70px;
position: absolute;
}
@media screen and (max-width: 500px) {
.logo{
margin: auto;
}
}
</style>
</head>
<body>
<div class="container">
<div class="row pt-2">
<div class="col-12 col-sm-12 col-md-2 mb-2 mb-md-0">
<div class="row">
<a href="#" class=" d-block">
<img class="logo d-block" width="100" src="https://www.google.com.vn/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png">
</a>
</div>
</div>
<div class="col-10 col-sm-10 col-md-8">
<form>
<input class="p-1 d-inline-block w-100 " type="text" name=""><button class=" btn-search">Search</button>
</form>
</div>
<div class="col-2 col-sm-2 col-md-2 push-right">
<img style="width:50px;" class="float-right" src="https://www.seekpng.com/png/detail/231-2317179_shopping-cart-icon-transparent-background-shopping-cart-icon.png">
</div>
</div>
<div class="mt-3" >
<h1>Responsive Header</h1>
phần header phía trên
</div>
</div>
</body>
</html>