| |
|
|
| | здравствуйте, знающие помогите решить проблему под IE.
значит есть 2 колонки (контент 100%, правая сторона фикс 300px)
ff и opera = если убрать правую сторону, то контент вытягивается полностью. (это и надо под IE)
ie = если убрать правую сторону, то контент НЕ вытягивается полностью, но если прописать 100% то вытянится но тогда при включении правой стороны - она просто съедит вниз :/ вот такая вот проблема непростая.
что надо править в куске стиля if ie чтобы получить результат как в ff и opera?
рузультаты:
opera, ff
http://s48.radikal.ru/i121/0903/5e/516c3ce69c54.gif
IE :(
http://s57.radikal.ru/i155/0903/e3/fc2fcaccca06.gif
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
<title>Untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style type="text/css">
#container {
width: 980px;
margin: 0 auto;
border: 1px solid #aaa;
}
#body {
border-collapse: collapse;
display: table;
table-layout: fixed;
}
#body-inner {
display: table-row;
}
#content, #sidebar {
display: table-cell;
padding: 0 1em;
}
#content {
/* width: 100%; */
}
#sidebar {
width: 300px;
background: #eee;
}
#sidebar p {
margin-left: -1em;
padding-left: 1em;
}
</style>
<!--[if lte IE 6]>
<style type="text/css">
#body {
overflow: visible;
width: 100%;
}
#content {
float: left;
width: 60%;
}
#sidebar {
float: left;
width: 300px;
}
</style>
<![endif]-->
</head>
<body>
<div id="container">
<div id="body">
<div id="body-inner">
<div id="content">
<p>Контент контент контент контент контент контент контент контент контент контент
Контент контент контент контент контент контент контент контент контент контент
Контент контент контент контент контент контент контент контент контент контент
Контент контент контент контент контент контент контент контент контент контент
Контент контент контент контент контент контент контент контент контент контент
Контент контент контент контент контент контент контент контент контент контент
Контент контент контент контент контент контент контент контент контент контент
Контент контент контент контент контент контент контент контент контент контент </p>
</div>
<div id="sidebar">
<p>Правая сторона правая сторона правая сторона правая
правая сторона правая сторона правая сторона
правая сторона правая сторона правая сторона
правая сторона правая сторона правая сторона
правая сторона правая сторона правая сторона
правая сторона правая сторона правая сторона
правая сторона правая сторона правая сторона
правая сторона правая сторона правая сторона
правая сторона правая сторона правая сторона</p>
</div>
</div>
</div>
</div>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: cod3sun
(23.03.2009 в 17:00)
| | | up :/
неужели никто не сталкивался с таким? | |
| |
|
|
| |
|
|
| |
для: cod3sun
(23.03.2009 в 21:38)
| | | up, верстальщики вы где? :) | |
| |
|
|
| |
|
|
| |
для: cod3sun
(23.03.2009 в 17:00)
| | | Задачу ставьте КОНКРЕТНЕЕ.
Что значит - "убрать правую сторону"?
Убрать текстовое содержание <div id="sidebar"> или же убрать вовсе сам <div id="sidebar"> ?
Кроме того:
1. ваши стили будет воспринимать только и исключительно MSIE v.8, ибо только восьмая версия снизойдёт до ваших правил:
display: table;
display: table-row;
display: table-cell;
|
Прочие версии MSIE этих ухищрений не понимают.
2. если вы дали какому-то тегу несвойственное ему значение стиля display, то неужели вы полагаете, что этот тег сразу же обретёт какие-то дополнительные свойства?
Свойства border-collapse и table-layout из HTML-тегов поддерживает только тег <TABLE>.
Тег <DIV>, какой бы вы ему стиль display не назначили, в тег <TABLE> не превращается. Да, он будет в 8-й версии ОТОБРАЖАТЬСЯ как таблица, но тегом <TABLE> всё же не станет.
3. и последнее замечание: я понимаю, что английский язык вовсе не так богат, как русский и слов в нём поменьше будет. Но даже в "бедном" английском языке можно было бы найти десяток слов для того, чтобы не именовать объекты страницы именами уже имеющихся на этой странице объектов. Я это про то, что совсем не стоит тегу <DIV> давать идентификатор body.
Чтобы вам было понятно последнее замечание, запустите в браузере MSIE пример:
<html>
<body onload="alert (body.innerText)">
<div id="body">aaa</div>
</body>
</html>
|
И ответьте сами себе - о каком теге идет речь в алерте? О теге <BODY> или о теге <DIV>? | |
| |
|
|
| |
|
|
| |
для: PAT
(26.03.2009 в 01:15)
| | | честно признаюсь код взял готовый и не правил его т.к не смог найти подходящего решения чтобы в IE 6 заработало как надо.
>Задачу ставьте КОНКРЕТНЕЕ.
>Что значит - "убрать правую сторону"?
>Убрать текстовое содержание <div id="sidebar"> или же убрать вовсе сам <div id="sidebar"> ?
задача конкретнее:
иногда необходимо отключить весь sidebar, т.е тогда когда он отключен - контент должен тянуться (как на рис.1 под ff,opera)
на рис.2 изображено IE 6, не смог пофиксить до варианта как на рис 1.
3. понимаю что глупо именовать дивом какие-либо элементы, сам я так никогда не именую идентификаторы..
вот собсно откуда брался говнокод http://www.sitepoint.com/examples/3col.html
просто я его урезал, но отладить под ie так и не получилось :) | |
| |
|
|
| |
|
|
| |
для: cod3sun
(26.03.2009 в 07:51)
| | | >задача конкретнее: иногда необходимо отключить весь sidebar
Смешно...
Заменили слово "убрать" на слово "отключить" и посчитали, что КОНКРЕТИЗИРОВАЛИ задачу? :-)
"Отключить" - это как?
Знаете, чтобы вы не придумали ещё какое-то слово-паллиатив словам "убрать" и "отключить", дайте здесь ваш имеющийся HTML-код, когда правая колонка "убрана"/"отключена". В топикстарте у вас код, где присутствуют ОБЕ колонки. Дайте теперь код, по которому вы сделали оба скриншота. | |
| |
|
|
