Проблемы верстки в ИЕ6.

[amelice]

Всем привет.

Помогите разобраться:

1. Возможно ли решить проблему связанную с :hover в ИЕ6, когда нужно его применить не только ссылке?

В меню я применила :hover к трем трем элементам, чтобы меню растягивалось не зависимо от разрешения экрана.

2. Есть прозрачный фон, в Ие 6 это серый фон. Как добиться прозрачности?

Может это тема обсуждалась, но я не нашла.

Ссылка.

Прошу не обращать внимания на баннеры, это за бесплатный хостинг. (

[Great Rash]

1) Только скриптом: «ie6 hover» в Google.

2) http://forum.htmlbook.ru/index.php?showtopic=10595

UPD: а не, по второму вопросу не понял сразу, подумал что про PNG речь, вот так делается прозрачный фон:

.opacity {
  background-color: rgba(100, 100, 100, 0.5);
}

<!--[if lt IE 9]>
.opacity {
  background:transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
  zoom: 1;
}
<![endif]-->

[Bonzash]

Наверное надо выделить жирным и шрифт увеличить для этого заголовка Полезные темы

[amelice]

1) Только скриптом: «ie6 hover» в Google.

2) http://forum.htmlbook.ru/index.php?showtopic=10595

UPD: а не, по второму вопросу не понял сразу, подумал что про PNG речь, вот так делается прозрачный фон:

.opacity {
  background-color: rgba(100, 100, 100, 0.5);
}

<!--[if lt IE 9]>
.opacity {
  background:transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
  zoom: 1;
}
<![endif]-->

Ты все правильно понял, вопрос как раз по поводу применения прозрачного png-файла было.

Буду штудировать топик, спасибо.

[amelice]

Great Rash, я тебя сразу не поняла. Твой пример в моем случае идеально б подошел. Тогда б отпала необходимость в использовании Png файла. Но у меня тока в фф работает.

В ИЕ вообще не работает.

А в коде условные комментарии должны находится между тегами <style>?

Как расшифровать этот фильтр?

Я в CSS файле написала:

.marker{
  background-color: rgba(0, 0, 0, 0.5);
  margin-top:225px;
  clear:both;
  width:100%;
  height:58px;
  }

а в html:

<style type="ctext/css">
<!--[if lt IE 9]>
.marker {
  background-color:transparent;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
	zoom: 1;
}
<![endif]-->
</style>
.
.
.
<ul class="marker">
 <li><a href="#"><img src=""><span>Contacts</span></a></li>
 <li><a href="#"><img src=""><span>About</span></a></li>
 <li><a href="#"><img src=""><span>Product</span></a></li>
</ul>

[sigma77]

cheburek,

<!--[if lt IE 9]>
<style type="ctext/css">
.marker {
  background-color:transparent;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);

        zoom: 1;
}

</style>
<![endif]-->

Внутри таблицы css не должно быть условных комментариев.

[amelice]

cheburek,

<!--[if lt IE 9]>
<style type="ctext/css">
.marker {
  background-color:transparent;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);

        zoom: 1;
}

</style>
<![endif]-->

Внутри таблицы css не должно быть условных комментариев.

а куда его нужно писать?

[sigma77]

cheburek,

Вокруг <style> Смотри мои исправления.

Еще лучше вынести все эти стили в отдельный файл.

[SelenIT]

Как расшифровать этот фильтр?

Фильтр задает градиент, по умолчанию горизонтальный сверху вниз, параметры — начальный и конечный цвета. Если цвета одинаковы (как тут), получается сплошная заливка. Прелесть фильтра в том, что цвета можно задавать в формате ARGB, который почти тот же rgba, только в чуть другом синтаксисе (прозрачность пишется в начале и тоже шестнадцатеричным числом, 00 - полная прозрачность, FF - полная непрозрачность). В итоге можно сделать полупрозрачную заливку фона. Вот здесь есть с виду удобный конвертор rgba в ARGB и обратно: Convert to and from rgba() and #ARGB.

[amelice]

cheburek,

Вокруг <style> Смотри мои исправления.

Еще лучше вынести все эти стили в отдельный файл.

sigma77я извиняюсь, не внимательно посмотрела.

Лучше наоборот, добавочный <style> брать в усл. комментарии.

это поняла, а в коде где? Между тегами <head>?

[sigma77]

это поняла, а в коде где? Между тегами <head>?

Да. <style> или <link> со ссылкой на css-файл для ИЕ помещаешь в <head> и обрамляешь их условными комментариями. Это если тебе надо подключить стили.

А так условные комментарии могут быть в любом месте кода.

Например:

<!--[if IE]>
	<p>Этот абзац увидет только ИЕ</p>
<![endif]-->

Вот, например, статьи про условные комментарии - http://htmlbook.ru/content/uslovnye-kommentarii, http://designformasters.info/posts/conditional-comments/

И вот еще заметила у тебя одну ошибку:

<style type="ctext/css">

[amelice]

Как расшифровать этот фильтр?

Фильтр задает градиент, по умолчанию горизонтальный сверху вниз, параметры — начальный и конечный цвета. Если цвета одинаковы (как тут), получается сплошная заливка. Прелесть фильтра в том, что цвета можно задавать в формате ARGB, который почти тот же rgba, только в чуть другом синтаксисе (прозрачность пишется в начале и тоже шестнадцатеричным числом, 00 - полная прозрачность, FF - полная непрозрачность). В итоге можно сделать полупрозрачную заливку фона. Вот здесь есть с виду удобный конвертор rgba в ARGB и обратно: Convert to and from rgba() and #ARGB.

SelenIT спасибо огромное за пояснения.

К сожалению, у меня интернет выборочно и долго работает.

(startColorstr=#99000050,endColorstr=#99000050)

Я как поняла первые шесть цифры отвечают за цвет, а последние два за прозрачность как и в rgba.

у меня фон получается синий и прозрачный при этих значениях, теперь жду когда сайт загрузится. Мне нужен черный фон. Дай пожалуйста линки, где можно почитать про фильтры?

это поняла, а в коде где? Между тегами <head>?

Да. <style> или <link> со ссылкой на css-файл для ИЕ помещаешь в <head> и обрамляешь их условными комментариями. Это если тебе надо подключить стили.

А так условные комментарии могут быть в любом месте кода.

Например:

<!--[if IE]>
	<p>Этот абзац увидет только ИЕ</p>
<![endif]-->

Вот, например, статьи про условные комментарии - http://htmlbook.ru/content/uslovnye-kommentarii, http://designformasters.info/posts/conditional-comments/

Спасибо! Все понятно.

И вот еще заметила у тебя одну ошибку:

<style type="ctext/css">

Да, тоже обнаружила.

Edited July 14, 2011 by cheburek

[sigma77]

Я как поняла первые шесть цифры отвечают за цвет, а последние два за прозрачность как и в rgba.

у меня фон получается синий и прозрачный при этих значениях, теперь жду когда сайт загрузится. Мне нужен черный фон.

Не, наоборот

Первые две - прозрачность. Остальные - цвет.

Дай пожалуйста линки, где можно почитать про фильтры?

Могу только на английском дать.

Правда там почти везде есть ссылка на пример, где можно поиграть со значениями.

http://msdn.microsoft.com/en-us/library/ms532853(v=VS.85).aspx

[web-monster]

Вот все решения прозрачности в IE6. Ссылка.

Сам пользуюсь скриптом DD_belated.png.

[amelice]

Всем большое спасибо!

Если кому интересно, 1-ый вопрос решила 1-ым вариантом, который на этом сайте представлен. Сама реализация мне не понятно, но очень простой в использовании.