Использование HTML, CSS для создания страницы поиска в Google выглядит одинаково ⇐ Html

[Anonymous]

Необходима помощь, < /p>
Я использовал позицию: абсолютно, чтобы позиционировать как мой логотип Google, так и кнопки поиска. моей страницы. Элементы, которые некоторые будут выровнены слева, а другие справа

Код: Выделить всё

ul {
list-style-type: none;
margin: 0;
padding: 0;
background-color: transparent;
}

li {
display: block;
float: right;
}

li a {
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

button a {}

.google-logo {
position: absolute;
margin: 10em 32.5em;
}

.feeling-lucky {
position: absolute;
margin: 20em 32.5em;
width: 400px;
}

#searchbar {
position: absolute;
top: 260px;
left: 375px;
width: 580px;
height: 30px;
border: 1px solid #cdcdcd;
}

#search_button {
position: absolute;
top: 310px;
left: 550px;
border: 1px solid #dcdcdc;
border-color: rgba(0, 0, 0, 0.1);
color: #444!important;
font-size: 11px;
font-weight: bold;
padding: 8px;
background: -webkit-linear-gradient(top, #f5f5f5, #f1f1f1);
border-radius: 2px;
}

#lucky_button {
position: absolute;
top: 310px;
left: 680px;
border: 1px solid #dcdcdc;
border-color: rgba(0, 0, 0, 0.1);
color: #444!important;
font-size: 11px;
font-weight: bold;
padding: 8px;
background: -webkit-linear-gradient(top, #f5f5f5, #f1f1f1);
border-radius: 2px;
}

.footer {
position: absolute;
right: 0;
bottom: 0;
left: 0;
padding: 1rem;
background-color: #efefef;
text-align: center;
margin: : 20em;
}< /code>




Google Homepage
[*]







[list]
[url=#][i][/i][/url]
[*][url=#][i][/i][/url]
[*][url=#][i][/i][/url]
[*][url=#]Images[/url]
[*][url=#]Mail[/url]
[/list]



[img]images/google-logo.jpg[/img]







[url=#]Advertising[/url][url=#]Business[/url][url=#]About[/url]

Подробнее здесь: https://stackoverflow.com/questions/468 ... look-alike