ПPИMEЧAHИE-----------------------------------------------Internet
Explorer версий б и ниже может неnравильно nонять размещение элемента, когда вы ис·
пользуете свойства Ьottom и right. В этом примере объявление widtt!: 100%; в стиле тега <h1>
устраняет проблему, что обсуждалось во врезке «Ошибки брауэеров• выше в этой главе.
Исключение элемента эа пределы блока
Вы можете также использовать позиционирование для размещения элемента таким
образом, чтобы он «выглядывал>) из-за другого элемента. На рис. 13.8 (2) верхнее
изображение показывает заголовок с графикой. Так, тег <img> помещен внуrрь тега
<hl> как часть заголовка. Использование абсолютного позиционирования и отрицательных
Значений свойств top и 1 eft позволяет переместить изображение
Мощные стратегии позиционирования 393
К левому краю заголовка и вытеснить его за верхний и левый края. Рассмотрим
СSS-код, который используется в этом примере:
h1 {
}
position: relative:
margin-top: 35рх:
padding-left: 55рх:
border-bottom: 1рх dashed #999999:
h1 img {
position: absolute:
top: -ЗОрх:
left: -ЗОрх:
Основная концепция этого кода такая же, что и в предыдущем примере, но с некоторыми
Дополнениями. Во-первых, значения top и l eft изображения отрицательные,
Так что графика фактически появляется на расстоянии 30 пиксело в над вершиной
Заголовка и 30 пикселов слева от левого края заголовка. Будьте внимательны,
