В Internet Explorer 9 проблема отображения div.post-outer

Модератор: Fleelancer

<<

Celsus

Аватара пользователя

Автор темы

Сообщения: 45

Зарегистрирован: 02 дек 2011, 14:29

Благодарил (а): 15 раз.
Поблагодарили: 3 раз.

Сообщение 02 дек 2011, 14:46

В Internet Explorer 9 проблема отображения div.post-outer

Черный прозрачный блок - div.post-outer

Opera и Chrome:
http://linkme.ufanet.ru/images/451a4346 ... 1acc05.jpg

В Internet Explorer:
http://linkme.ufanet.ru/images/3f7a55d7 ... d09e65.jpg

Раньше был такой код, вроде:
  Код:
.post-outer {
  background-color: $(post.background.color);
  border: solid 1px $(post.border.color);

  -moz-border-radius: $(post.border.radius);
  -webkit-border-radius: $(post.border.radius);
  border-radius: $(post.border.radius);
  -goog-ms-border-radius: $(post.border.radius);

  padding: 15px 25px;
  margin: 0 $(post.margin.sides) 15px;

Я измемнил последнюю строчку на 20px, чтобы выровнять картинку по центру

В IE код такой:
  Код:
.post-outer {
background-color: #1c1c1c;
border: solid 1px transparent;
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
-goog-ms-border-radius: 0;
padding: 15px 25px;
margin: 0 -20px 20px;
}


Как вино из последнего кода в параметр margin IE9 видит только 3 значения, разве их не должно быть четыре?
<<

sv9t

Аватара пользователя

Сообщения: 729

Зарегистрирован: 23 апр 2011, 01:14

Откуда: Киров

Благодарил (а): 8 раз.
Поблагодарили: 92 раз.

Сообщение 03 дек 2011, 08:19

Re: В Internet Explorer 9 проблема отображения div.post-oute

Celsus писал(а):Как вино из последнего кода в параметр margin IE9 видит только 3 значения, разве их не должно быть четыре?

можно и так,он их не "видит"а так прописано, читайте здесь
Путь сновидений - Hemi-sync, Астрал, ОС, Эзотерика, Йога
Sv9t.ru - CMS, Jquery, HTML5, CSS3, IT, PHP

"Делаю перелинковку на FAQ, телепат без отпуска, наивный оптимизатор, танцую с бубном"
<<

Celsus

Аватара пользователя

Автор темы

Сообщения: 45

Зарегистрирован: 02 дек 2011, 14:29

Благодарил (а): 15 раз.
Поблагодарили: 3 раз.

Сообщение 05 дек 2011, 19:07

Re: В Internet Explorer 9 проблема отображения div.post-oute

sv9t писал(а):
Celsus писал(а):Как вино из последнего кода в параметр margin IE9 видит только 3 значения, разве их не должно быть четыре?

можно и так,он их не "видит"а так прописано, читайте здесь

Спасибо. Есть еще одна проблема с IE 9. Не получается сделать отображаемый фон для post-outer. Не обязательно градиентовый и вертикальный, просто прозрачный черный.

  Код:
.post-outer {

background:rgba(136,191,239,0.65);
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 46%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(46%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 46%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 46%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 46%,rgba(0,0,0,0.65) 100%); /* IE10+ */
background: linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 46%,rgba(0,0,0,0.65) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */

-webkit-border-radius:0 0 27px 27px;
  -goog-ms-border-radius:0 0 27px 27px;
  border-radius:0 0 27px 27px;

  padding: 15px 20px;
  margin: 0 $(post.margin.sides) 0px;
}


Работает только в других браузерах (Chrome, opera)

Могут ли где-то быть другие параметры, которые влияют на post-outer?

В .content-outer прозрачный градиент в IE работает (правда, там не отображается рамка, отображается только на мгновение =)

На всякий случай пример работающего в IE9 фона для content-outer

  Код:
.content-outer {
font-size: 90%;

/*border-bottom:1px solid rgba(255,255,255,0.30);
border-right:1px solid rgba(255,255,255,0.30);*/

/* background: $(content.background); */

background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(136,191,239,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(136,191,239,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(136,191,239,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(136,191,239,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(136,191,239,0) 100%); /* IE10+ */
background: linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(136,191,239,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
 
padding:0;
margin: $(content.margin) auto;

-moz-box-shadow: inset 0px 0px 18px 0px #161617, ;
-webkit-box-shadow: inset 0px 0px 18px 0px #161617;
-goog-ms-box-shadow: inset 0px 0px 18px 0px #161617;
box-shadow: inset 0px 0px 18px 0px #161617;

-moz-border-radius:15px 15px 200px 40px;
-webkit-border-radius:15px 15px 200px 40px;
-goog-ms-border-radius:15px 15px 200px 40px;
border-radius:15px 15px 200px 40px;
}

Проверил, дубликатов .post-outer нет (иногда бывают =), стандартный параметр background-color: $(post.background.color); удалил
<<

sv9t

Аватара пользователя

Сообщения: 729

Зарегистрирован: 23 апр 2011, 01:14

Откуда: Киров

Благодарил (а): 8 раз.
Поблагодарили: 92 раз.

Сообщение 05 дек 2011, 21:09

Re: В Internet Explorer 9 проблема отображения div.post-oute

Celsus писал(а):background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 46%,rgba(0,0,0,0.65) 100%); /* IE10+ */

Уже IE10 вышел?))

У тебя коды разные из работающего и неработающего, скопируй с рабочий и вставь в верхний.
Насколько мне известно IE9 поддерживает opacity:.
  Код:
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
    filter:alpha(opacity=65);
    opacity: 0.65;

Может попробовать прописать так? и background-color: черным поставь.
Или вот наткнулся на интересное решение, реализованное в js, можешь тоже попробовать), мне увы негде. Тем более придаешь такое значение IE.
А так, имхо, плюнь на IE и напиши что "для правильного отображение сайта желательно использовать последние версии браузеров". Этим IE в основном пользуются только за рубежом.
Путь сновидений - Hemi-sync, Астрал, ОС, Эзотерика, Йога
Sv9t.ru - CMS, Jquery, HTML5, CSS3, IT, PHP

"Делаю перелинковку на FAQ, телепат без отпуска, наивный оптимизатор, танцую с бубном"
<<

Celsus

Аватара пользователя

Автор темы

Сообщения: 45

Зарегистрирован: 02 дек 2011, 14:29

Благодарил (а): 15 раз.
Поблагодарили: 3 раз.

Сообщение 10 дек 2011, 23:05

Re: В Internet Explorer 9 проблема отображения div.post-oute

sv9t писал(а):Насколько мне известно IE9 поддерживает opacity:.
  Код:
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
    filter:alpha(opacity=65);
    opacity: 0.65;

Может попробовать прописать так? и background-color: черным поставь.

Спасибо за вариант с opacity для обоих версий (10 и 9). Думаю, это и будет альтернатива, поскольку при использовании градиента и прозрачности, в Internet Explorer 9 с отображением возникает проблема

sv9t писал(а):А так, имхо, плюнь на IE и напиши что "для правильного отображение сайта желательно использовать последние версии браузеров". Этим IE в основном пользуются только за рубежом.

Хорошая идея, обязательно так сделаю, посоветую Chrome или Opera или Firefox (до последнего никак не дойдут руки).

Добавлено спустя 1 минуту 27 секунд:
Re: В Internet Explorer 9 проблема отображения div.post-outer
Градиент я сделал на сервисе colorzilla (gradient editor)

Вернуться в Вопросы от новичков

Кто сейчас на конференции

Зарегистрированные пользователи: Google [Bot]

Работает на phpBB © 2000, 2002, 2005, 2007 phpBB Group. Дизайн ST Software и Blogger Форум. Русская поддержка phpBB
ЧПУ ссылки от phpbb seo