background h2

M

10

mikekoro

23 марта 2011, 03:49

698

Не могу сделать чтобы background прилипал к тектсу заголовка h2

если делать просто

h2 {

background:red;

}

то RED тянится на всю строку

если сделать

h2 {

background:red;

display:inline

}

то вроде бы все зашибись заисключением одного - неработает margin-bottom и header липнет к тексту.

прекрасно работает <span style="background:red)">some text</span> но мне нужно чтобы все работало только от h2...

Подскажите...

168

dma84

23 марта 2011, 04:25

#1

для h2 float:left

T

67

Toy

23 марта 2011, 05:34

#2

для h2 float:left

Либо абсолютное позиционирование.

то вроде бы все зашибись заисключением одного - неработает margin-bottom и header липнет к тексту.

Можете обернуть его в div, которому и задать margin.

Не забудьте попробовать многострочный заголовок. Ожидаемый ли результат вы получили?

198

Руслан Исмаилов

23 марта 2011, 07:14

#3

HTML:

CSS:

.title-block { overflow:hidden; _zoom:1; }
.title-block h2 { float:left; background:red; padding:5px; margin:5px; }

Как то так, остальное замените под свои нужды.

T

67

Toy

23 марта 2011, 10:03

#4

musulman,

м?

Решение тут http://chikuyonok.ru/2010/01/uniform-text-background/

198

Руслан Исмаилов

23 марта 2011, 11:10

#5

Toy, непонял, к чему эта иллюстрация?

T

67

Toy

23 марта 2011, 11:15

#6

musulman, вы по ссылке прошлись?

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

168

dma84

23 марта 2011, 11:19

#7

тогда так:

h2{display:inline-block;background:red;}

но 6 и 7 ИЕ отдыхают

198

Руслан Исмаилов

23 марта 2011, 11:22

#8

Toy, да прошел посмотрел, неучел этого момента:)

M

10

mikekoro

23 марта 2011, 23:45

#9

dma84:
тогда так:

h2{display:inline-block;background:red;}

но 6 и 7 ИЕ отдыхают

inline-block yahooooo! спасибо:)

Яндекс Вебмастер вынес товарные фиды в отдельный раздел

Переиграть и победить: как анализировать конкурентов для продвижения сайта