Переполнение IE7 и фоновые изображения IE7 - PullRequest
Новая
       9

Переполнение IE7 и фоновые изображения IE7

0 голосов
/ 05 октября 2009

Две проблемы, обе из-за IE7

www.myvintagesecret.com

1) У меня есть Div, называемый .postheader, который содержит заголовок, и другой div, называемый .clip. Как видите, клип должен зависать над содержимым, а не опускать его вниз. (используйте любой другой браузер для тестирования). В настоящее время это дает мне огромный пробел, когда он должен идти только до тех пор, пока текст делает. 

.postheader {
    background:url(images/posthead.png) no-repeat;
    min-height:100px;
    max-height:600px;
    padding-right:25px;
    overflow:visible;
}

.clip {
    width:214px;
    height:275px;
    float:right;
    position:relative;

}

Есть идеи? Я могу уменьшить максимальную высоту, но это приводит к обрезанию .clip div.

2) На боковой панели есть группа элементов, называемых .sidebaritem. У них есть фоновое изображение, которое не отображается только в IE7. Я не могу понять это. 

.sidebar-item
{
    background:url(images/sidebar.png)top center no-repeat;
    font-size: 12px;
    margin-bottom: 20px;
    padding-left: 18px;
    padding-right:10px;
    padding-top:8px;
    min-height:200px;

}

Ответы [ 2 ]

1 голос
/ 05 октября 2009

Я думаю, что я решил 1) с этими изменениями

.clip drop float right, измените положение на абсолютное и присвойте ему значение 0.

.postheader добавить позицию относительно

.postheader h2 ширина около 400px

Похоже, что работает в IE7 и Firefox, но не знаю, как это выглядело в других браузерах.

1 голос
/ 05 октября 2009

1) Попробуйте это. Я думаю, что использование position: absolute вместо float: right решит проблему. 

.postheader {
    background:url(images/posthead.png) no-repeat;
    position:relative;
}

.clip {
    width:214px;
    height:275px;
    position:absolute;
    top:0;
    right:25px;
}

2) Хм .. Это может быть пробел после закрытия). 

background:url(images/sidebar.png) top center no-repeat;

3) Ответ на комментарий: В этом случае ... Вам следует переделать фон. Создавайте обертки только с фоном и помещайте свой контент внутрь. Клип должен быть верхним div внутри обертки и плавать вправо. Сделай что-то вроде ... 

<div class="itemTopBg"><div class="itemBottomBg"><div class="itemLeftBg"><div class="itemRightBg">
  <div class="clip">...</div>
  ... content with no bg... just text...
</div></div></div></div>
...