Я пытаюсь создать веб-сайт с заголовком, который повторяется по всей ширине страницы, с названием веб-сайта в центре заголовка и логотипом, слегка смещенным по отношению к имени веб-сайта.Если ширина экрана слишком мала для отображения всего логотипа, я просто хочу, чтобы он обрезал логотип вправо, в противном случае будет отображаться весь логотип (т. Е. Монитор / окно достаточно велико. Что я не делаюхочу, чтобы изображение всплыло вправо. Я хочу, чтобы оно было более или менее абсолютно расположено рядом с заголовком.
Однако я не могу найти способ сделать это. Я не могуиспользуйте overflow-x или overflow-y (из-за поддержки браузера), и разметка, которая у меня есть, просто расширяет окно с помощью полосы прокрутки для размещения всего изображения (см. скриншот).
Вот экранвыстрел
http://img691.imageshack.us/img691/3188/screenshot03062011.jpg
Вот разметка и CSS:
<div id="header-wrap">
<div id="header">
<img src="title-card.png" />
<img id="this-chick-logo" src="this-chick-logo.png" />
</div>
</div>
--
body
{
background: #dfb1e4;
padding: 0px;
margin: 0px;
}
#header-wrap
{
background: url('header-bg.png') repeat-x;
width: 100%;
height: 291px;
}
#header
{
margin: 0 auto;
width: 1000px;
text-align: center;
}
#header img
{
margin-top: 105px;
}
#header img#this-chick-logo
{
margin-top: -75px;
margin-left: 680px;
overflow: hidden;
}
Спасибо.