Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Ответ
 
Опции темы
Старый 06.11.2018, 17:13   #1
Vaginator
Новичок
 
Регистрация: 06.11.2018
Сообщений: 2
Репутация: 10
По умолчанию Контент разделен на 2 строки

Привет! Сел за программирование(если можно так про HTML и CSS сказать) лишь месяц назад,потому сильно прошу не кидаться тапками. Решил, чтоб как-то поднять умения, найти готовый сайт и попытаться сделать точно такой же самому. У меня иконка поиска и навигация разбиваются на 2 строки, хотя такого не должно быть. Не могу это исправить. На первом скриншоте видно, что у меня, а на втором - что должно быть. Заранее спасибо!

HTML
Код:

<body>
  <div class="wrapper">
    <header>
      <div class="Logo">
	<a href="#"> <h1>Huh</h1> <img src="img/Logo.jpg" alt="Logo"> </a>
      </div>				
      <nav>
	<ul class="menu">
          <li><a href="#">Home</a></li>
	  <li><a href="#">Features</a></li>
	  <li><a href="#">Pages</a></li>
	  <li><a href="#">Shop</a></li>
	  <li><a href="#">Business</a></li>
	  <li><a href="#">Travel</a></li>
	  <li><a href="#">Contact</a></li>
	</ul>
	<div class="menu">
	  <form>
	    <button class="button"> <i class="fas fa-search"></i> </button>
	  </form>
      	</div>
      </nav>
    </header>
  </div>
</body>

CSS
Код:

header {
	background: #FFF;
	min-height: 67px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}



.button {
	background: transparent;
	color: #333333;
	border: 0;
}

.Logo h1 {
	display: none;
}

nav ul.menu {
	text-align: center;
	justify-content: space-between;
	font-size: 0;
}

nav ul.menu li {
	display: inline-block;
	font-size: 13px;
}

nav ul.menu li a {
	padding-right: 15px;
	padding-left: 15px;
	min-height: 67px;
	display: block;
	line-height: 67px;
}

Изображения
Тип файла: jpg Снимок1.JPG (14.3 Кб, 0 просмотров)
Тип файла: jpg 2.JPG (18.3 Кб, 0 просмотров)

Последний раз редактировалось Vaginator; 06.11.2018 в 17:20.
Vaginator вне форума   Ответить с цитированием
Ответ

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
контент и футер lansh HTML и CSS 2 30.10.2012 21:05
Не выводиться контент!!! might2012 WordPress и другие CMS 0 06.04.2012 15:51
Можно ли переместить контент, не перемещая строки кода? vlad-55 HTML и CSS 6 10.03.2012 17:22
Меняющийся контент 9GYAR HTML и CSS 3 20.07.2011 16:01
Постоянный контент страницы Ivanchikov HTML и CSS 7 15.03.2010 19:59


07:38.


Powered by vBulletin® Version 3.8.8 Beta 2
Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.

RusProfile.ru


Справочник российских юридических лиц и организаций.
Проекты отопления, пеллетные котлы, бойлеры, радиаторы
интернет магазин respective.ru