@Antoshkaplehanov

Как расположить форму в правом углу хэдера?

f271e6f629524b9ebd41e6fdb846937b.png
Подскажите люди добрые, как мне форму расположить в правом углу хэдера и выровнять кнопку поиска с полем для ввода текста?
Заранее спасибо!
P.S. пробывал float прописывать, форма только смещается вправо, не залазит, также выпадает из хэдера.
Ссылка на HTML,CSS код : https://jsfiddle.net/0bmjzmyy/
  • Вопрос задан
  • 260 просмотров
Решения вопроса 1
@senselessV7
1. h1 и p обернуть в div обязательно и задатьfloat: left, тогда и для формы сработает float: right

2.
<header class="top_header">
			<div class="wrap">
			  <div class="header__left">
			  <h1><span>Н</span>азвание сайта</h1>
              <p>Подзаголовок сайта или какой-нибудь слоган.</p>
              </div>
              <form class="search__form">
               <input type="search" name="q" placeholder="Поиск..."> 
               <input type="submit" value=""></p>
              </form>
			</div>
		</header>

Для выравнивания, внутри header помещаем
.wrap {
  max-width: 980px;
  width: 100%;
  margin: 0 auto;
}

3. На странице может использоваться всего один h1, не более!!! (Кинулось в глаза)

jsbin.com
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы