.top_navbar_items{
display: flex;
justify-content: flex-end;
list-style: none;
margin: 15px;
}
.top_navbar_items a{
display: block;
padding: 5px;
text-decoration: none;
}
.google_logo{
display: flex;
justify-content: center;
margin: auto;
margin-top: 150px;
width: 585px;
}
#search_icon{
background-image: url(https://image.flaticon.com/icons/svg/751/751463.svg);
background-repeat: no-repeat;
height: 30px;
width: 30px;
margin-top: 10px;
margin-bottom: auto;
margin-left: 10px;
margin-right: 10px;
}
.search_box{
display: flex;
justify-content: center;
margin-top: 10px;
margin-bottom: 10px;
}
.search_btns{
display: flex;
justify-content: center;
}
p{
text-align: center;
}
footer{
position:absolute;
bottom:0;
display:flex;
width:100%;
margin:auto;
background-color:rgba(240,240,240);
}
li{
display: inline-block;
margin:5px;
}
a{
text-decoration: none;
}
.fbar_right{
display: flex;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
<title>Google</title>
</head>
<body>
<div class="main_content">
<nav class="top_navbar">
<ul class="top_navbar_items">
<li><a href="#">Gmail</a></li>
<li><a href="#">Images</a></li>
<li><a href="#">Sign in</a></li>
</ul>
</nav>
<div class="google_logo">
<img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png">
</div>
<div class="search_form">
<div class="search_box">
<div id="search_icon"></div>
<input type="text" name="search_bar">
</div>
<div class="search_btns">
<input type="submit" value="Google Search" name="Google Search">
<input type="submit" value="I'm Feeling Lucky" name="I'm Feeling Lucky">
</div>
</div>
<p>
Google offered in: <a href="#">English</a>
</p>
</div>
<footer>
<ul class="fbar_left">
<li><a href="#">Advertising</a></li>
<li><a href="#">Business</a></li>
<li><a href="#">About</a></li>
<li><a href="#">How Search works</a></li>
</ul>
<ul class="fbar_right">
<li><a href="#" class="test">Privacy</a></li>
<li><a href="#">Terms</a></li>
<li><a href="#">Settings</a></li>
</ul>
</footer>
</body>
</html>
Я хотел бы указать sh Условия предоставления услуг в правой нижней части экрана, но я не смог заставить его работать! Я попытался поместить их в flexbox и попытаться изменить поток, но это не перемещает их вообще.
Также есть ли другой способ поместить нижний колонтитул рядом с нижней частью страницы, кроме position: absolute; внизу: 0;
Спасибо за потраченное время