Выравнивание логотипа с навигационной панелью

Я очень новичок в разработке веб-сайтов, и в настоящее время я пытаюсь получить логотип и список элементов для согласования друг с другом в заголовке. Я был бы очень признателен за ваш совет относительно того, что делать, чтобы исправить эту проблему.Выравнивание логотипа с навигационной панелью

У меня есть ссылка для ссылки. https://gist.github.com/59c56461658d2011f8fc

Большое спасибо,

Джош

источник

2016-01-23 Joshua Palfreman

заведите jsfiddle/plunker –

Посмотрите на http://stackoverflow.com/questions/34566804/how-to -align-an-image-and-text-vertically-in-the-middle/34566964 # 34566964 –

Ваш логотип переполнен, потому что <img> высота не установлена. Если вы установите высоту с помощью CSS, она будет ограничена максимальной высотой ее родителя (навигационной панели). Вы можете сделать это, добавив следующий код в CSS:

.logo img { 
    height: 100%; 
}

JSFiddle: https://jsfiddle.net/Hybridx24/pxd1pjwz/

источник

2016-01-23 08:15:41 Hybrid

Это происходит так же, если он устанавливает img {max-width: 100%; height: auto;}, я имею в виду с автоматической высотой, влияет ли изображение на высоту контейнера? –

Нет, потому что 'height: auto' по умолчанию anyways (который не работает для него), а' max-width: 100% 'означает, что высота будет по-прежнему слишком высокой, поэтому в основном с этим кодом она все равно будет содержать те же ошибки. – Hybrid

Нет, я не говорю в его случае, я говорю вообще .. высота: автофилла utomatically высота контейнера –

Ok Все, что вам нужно сделать, это изменить СЧА с плавающей точкой: право; плавать: слева;

Вот ссылка с codepen:

<a href="http://codepen.io/HTMLNoob/pen/xZYrpW">Example</a>

источник

2016-01-23 08:27:38 HTMLNoob

Вы не определяете логотип максимальной высоты и максимальную ширину. Таким образом, ваш логотип выходит за пределы раздела заголовка.

Поместите этот CSS в файл CSS:

.logo img { 
 
    max-height: 100%; 
 
    max-width:100%; 
 
}

источник

2016-01-23 08:37:17

Выравнивание логотипа с навигационной панелью

ответ

Смежные вопросы