Форум Сайтостроение Веб-строительство

Как разместить h1 и h2 в одну строчку? (css)

=Lexx=
На сайте с 14.01.2009
Offline
117
=Lexx=
9438

Как разместить h1 и h2 в одну строчку и по центру? Одно после другого:

ЗАГОЛОВОК: подзаголовок

Пытаюсь сделать так:


<div style="margin:0 auto; padding:0 auto;">
<div><h1 style="font-size: 16px;">Заголовок</h1></div>
<div><h2 style="font-size: 14px;">подзаголовок</h2></div>
<div>

если заголовкам float:left поставить, то они в одну строчку выравниваются, но слева :(

а без float один под другим получаются.

vlad00777
На сайте с 24.12.2009
Offline
119
vlad00777
#1

display:inline-block; попробуйте.

---------- Добавлено 10.08.2012 в 15:23 ----------

<div style="margin:0 auto; width:ширина родительского блока;">

<h1 style="font-size: 16px; display:inline-block;">Заголовок</h1>

<h2 style="font-size: 14px; display:inline-block;">подзаголовок</h2>

<div>

Верстка. Качественно! Адаптивная, резиновая, с параллаксом и прочими плюшками. В ЛС.
87793
На сайте с 12.09.2009
Offline
661
87793
#2

Ну, вообще-то, <H...> предполагает, что то, что выделено этими тегами, занимает отдельную строчку 😂

Я бы сделал так (фонтсайз и дивы здесь не прописываю; речь о принципе): 

<h1>Заголовок : <small>Подзаголовок</small></h1>

или так: 

<h1><big>Заголовок</big> : Подзаголовок</h1>

То бишь всё в одну строчку, в один h-тег, а размер шрифта внутри оного уже двигать бигом или смоллом (по вкусу :))

Наше дело правое - не мешать левому!
eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Могут ли «плохие» входящие
=Lexx=
На сайте с 14.01.2009
Offline
117
=Lexx=
#3
vlad00777:
display:inline-block; попробуйте.

---------- Добавлено 10.08.2012 в 15:23 ----------

<div style="margin:0 auto; width:ширина родительского блока;">
<h1 style="font-size: 16px; display:inline-block;">Заголовок</h1>
<h2 style="font-size: 14px; display:inline-block;">подзаголовок</h2>
<div>

Все-равно слева отображается. В принципе, норм, но желательно по центру

M
На сайте с 15.03.2012
Offline
101
Moltisanti
#4

inline-block не работает в IE7, если вдруг это Вас озаботит)

как альтернатива float: left у обоих

=Lexx=
На сайте с 14.01.2009
Offline
117
=Lexx=
#5
Moltisanti:
inline-block не работает в IE7, если вдруг это Вас озаботит)
как альтернатива float: left у обоих

в этом и проблема - либо в строчку, либо по центру получается )

ie7 не заботит )

vlad00777
На сайте с 24.12.2009
Offline
119
vlad00777
#6

Ширину значит не правильно указали. У меня все работает.

=Lexx=
На сайте с 14.01.2009
Offline
117
=Lexx=
#7
vlad00777:
Ширину значит не правильно указали. У меня все работает.

ага. копировал когда - еще другой код был )

спасибо. все получилось.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий