Вечная тема: CSS и IE

Старый mweb

Модератор: [mweb team]

Вечная тема: CSS и IE

Сообщение IceBerg Чт апр 16, 2009 11:04

Привет всем.

В описании стилей пишу:

Код: Выделить всё
#main-left{
  width: 258px;
  height: 250px;
  display: block;
  float: left;
// margin-top: 0px;
  background: #FFF;
}

#main-right{
  min-width: 750px;
//  width:expression(document.body.clientWidth < 750 ? "750px" : "100%" );
  margin: 0px 0px 0px 258px;
//  margin-left: 258px;
//  padding-left: 0px;
  min-height: 400px;
  background: #F5F5F5;
}


В html это используется так:

Код: Выделить всё
<div id="main-left">
  ... какой-то код ...
</div>
<div id="main-right">
  ... какой-то код ...
</div>


Чего хочу добиться из кода в общем должно быть понятно. Когда окно браузера становится меньше, установленной величины, а миенно, правый див становится уже 750 пикселей, то его ширина должна стать равной именно 750 пикселей, иначе ширина правого дива 100%. Сжимаю окно браузера. Когда прохожу искомую ширину, правый див все-равно в ИЕ продолжает сужаться еще долго, пока, наконец этот правый див не уезжает под левый. Что-то я туплю. Где я неправ?
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение Skay Чт апр 16, 2009 12:26

замени:
width:expression(document.body.clientWidth < 750 ? "750px" : "100%" );

на:
width:expression(document.element.clientWidth < 750 ? "750px" : "100%" );

или на более универсальное:
Код: Выделить всё
            width:expression(
                (document.compatMode && document.compatMode == 'CSS1Compat')
                ?
                (
                    document.documentElement.clientWidth < 750
                    ?
                    "750px"
                    :
                    (
                        document.documentElement.clientWidth > 990
                        ?
                        "990px"
                        :
                        "auto"
                    )
                )
                :
                (
                    document.body.clientWidth < 750
                    ?
                    "750px"
                    :
                    (
                        document.body.clientWidth > 990
                        ?
                        "990px"
                        :
                        "auto"
                    )
                )
            );
money + sleep = awesome
Аватара пользователя
Skay
Хронический Астматик
 
Сообщения: 1373
Зарегистрирован: Вс мар 10, 2002 1:01

Re: Вечная тема: CSS и IE

Сообщение Skay Чт апр 16, 2009 12:33

вариант для блоков:

Код: Выделить всё
<html>

<head>
<style>
   html, body { margin: 0; padding: 0; }
   #main-right-wrap{
      width: 100%;
      float: left;
      
   }
   #main-right{
      margin-left: 250px;
      background-color: yellow;
   }
   #main-left{
      float: left;
      margin-left: -100%;
      width: 250px;
      background-color: pink;
   }
</style>
</head>

<body>

<div id="main-right-wrap">
   <div id="main-right">
     ... какой-то код ...
   </div>
</div>
<div id="main-left">
  ... какой-то код ...
</div>

</body>
</html>
money + sleep = awesome
Аватара пользователя
Skay
Хронический Астматик
 
Сообщения: 1373
Зарегистрирован: Вс мар 10, 2002 1:01

Re: Вечная тема: CSS и IE

Сообщение kost Чт апр 16, 2009 13:09

IceBerg писал(а): иначе ширина правого дива 100%.

А "левый" див тогда будет где располагаться?
Аватара пользователя
kost
Заядлый `курильщик`
 
Сообщения: 701
Зарегистрирован: Ср апр 16, 2003 16:56
Откуда: Санкт-Петербург

Re: Вечная тема: CSS и IE

Сообщение IceBerg Чт апр 16, 2009 13:26

Skay писал(а):замени:
width:expression(document.body.clientWidth < 750 ? "750px" : "100%" );

на:
width:expression(document.element.clientWidth < 750 ? "750px" : "100%" );


Все равно уезжает :)
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение IceBerg Чт апр 16, 2009 13:29

kost писал(а):
IceBerg писал(а): иначе ширина правого дива 100%.

А "левый" див тогда будет где располагаться?

Левый располагается там, где ему и положено - слева. и ширину занимает 258px. А у правого дива указан отступ слева как раз на эту величину. Кроме того, левый - фиксированной ширины и описан он в коде раньше "резинового" правого. Проблема не с левым. Првый бесконечно сужается и уплывает под левый в конечном счете.
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение kost Чт апр 16, 2009 14:02

Если у блока отступ 258px и ширина 100%, то он должен уползать за экран.

Вы хотите сделать резиновый дизайн из двух колонок, одна из них фиксированной ширины, другая растягивается?
Аватара пользователя
kost
Заядлый `курильщик`
 
Сообщения: 701
Зарегистрирован: Ср апр 16, 2003 16:56
Откуда: Санкт-Петербург

Re: Вечная тема: CSS и IE

Сообщение IceBerg Чт апр 16, 2009 14:10

kost писал(а):... Вы хотите сделать резиновый дизайн из двух колонок, одна из них фиксированной ширины, другая растягивается?

Именно так. При этом резиновость условная, до некоей минимальной ширины.
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение IceBerg Чт апр 16, 2009 14:13

kost писал(а):Если у блока отступ 258px и ширина 100%, то он должен уползать за экран.

Должен, но не уползает
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение kost Чт апр 16, 2009 15:46

IceBerg писал(а):Должен, но не уползает

Значит, вы что-то неправильно делаете. :)

IceBerg писал(а):Именно так. При этом резиновость условная, до некоей минимальной ширины.

Мне кажется, вы изобретаете какой-то неправильный велосипед. Почитайте классику: http://www.alistapart.com/articles/negativemargins, и ограничьте min-width для body.
Аватара пользователя
kost
Заядлый `курильщик`
 
Сообщения: 701
Зарегистрирован: Ср апр 16, 2003 16:56
Откуда: Санкт-Петербург

Re: Вечная тема: CSS и IE

Сообщение IceBerg Чт апр 16, 2009 16:29

Попробую написать подробнее. Есть макет сайта, структуру которого я приведу в картинке.

Изображение

В верхней части - 1 находится флешка. И вообще говоря, когда окно браузера достаточно сильно сжато по ширине, из-за нее появляется горизонтальный скролл, она попросту не помещается.

2 - это и есть мой левый див фиксированного размера.
3 - содержит текст и графику

min-width для body точно не подходит. Из-за флешки в хедере, когда уже есть горизонтальный скролл, текст в третьем блоке все-равно продолжает сжиматься. Я привел код, в котором описал как у меня обозначены области 2 и 3. Очевидно, что я где-то накосячил. Я и прошу указать на ошибки :).
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение kost Чт апр 16, 2009 16:59

Я бы посоветовал переписать код.

Вот, например: http://scala.wd2.ru/company/news/2009/01/4/
Такая же структура, как на картинке. При уменьшении до какой-то ширины появляется горизонтальный скролл, и блоки не слетают.
Аватара пользователя
kost
Заядлый `курильщик`
 
Сообщения: 701
Зарегистрирован: Ср апр 16, 2003 16:56
Откуда: Санкт-Петербург

Re: Вечная тема: CSS и IE

Сообщение Skay Чт апр 16, 2009 18:08

kost
так я ему уже переписал код во втором своем посте)
money + sleep = awesome
Аватара пользователя
Skay
Хронический Астматик
 
Сообщения: 1373
Зарегистрирован: Вс мар 10, 2002 1:01

Re: Вечная тема: CSS и IE

Сообщение kost Чт апр 16, 2009 19:55

Skay, не заметил. Увидел только expressions..., подумал, что там продолжение.
Аватара пользователя
kost
Заядлый `курильщик`
 
Сообщения: 701
Зарегистрирован: Ср апр 16, 2003 16:56
Откуда: Санкт-Петербург

Re: Вечная тема: CSS и IE

Сообщение IceBerg Пт апр 17, 2009 9:59

Skay, Пробовал подставлять твой код (тот, что для блоков), переписывал свой код как-то иначе. - Дивы позиционируются нормально. Но текст в правом блоке при умньшении ширины окна сужается до упора.

А с этим куском кода что? в скрипт его и повесить например на body onLodad?

Код: Выделить всё
            width:expression(
                (document.compatMode && document.compatMode == 'CSS1Compat')
                ?
                (
                    document.documentElement.clientWidth < 750
                    ?
                    "750px"
                    :
                    (
                        document.documentElement.clientWidth > 990
                        ?
                        "990px"
                        :
                        "auto"
                    )
                )
                :
                (
                    document.body.clientWidth < 750
                    ?
                    "750px"
                    :
                    (
                        document.body.clientWidth > 990
                        ?
                        "990px"
                        :
                        "auto"
                    )
                )
            );
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение kost Пт апр 17, 2009 10:18

IceBerg, вот готовая разметка: http://www.brunildo.org/test/lf100r.html

Там стоит min-width: 404px, ничего не сжимается после достижения этой ширины. И никаких expressions.

В вашем случае, предположу, сжимается дальше из-за того, что ширина flash больше, чем min-width.
Аватара пользователя
kost
Заядлый `курильщик`
 
Сообщения: 701
Зарегистрирован: Ср апр 16, 2003 16:56
Откуда: Санкт-Петербург

Re: Вечная тема: CSS и IE

Сообщение IceBerg Пт апр 17, 2009 10:32

kost, действительно, ширина флешки больше, чем min-width. Пробовал подставить в expression значение большее, чем ширина флешки. - Не работает.

Если я ставлю width.expression.element.clientWidth - то текст сужается до бесконечности.
Если пишу width.expression.body.clientWidth - то текст сужается до указанной ширины окна браузера, после чего правый див перестает уменьшаться, принимает ширину, равную указанной ширине, но смещается целиком вниз, на высоту, равную левому диву.

Я выложил это "чудо" - http://www.rentforrest.ru/ в сеть. Весь код и css прилагается. Написан путанно (переписывал несколько раз, но можно увидеть. Речь идет о #cont, #cont-levo и #cont-pravo

ЧТО я делаю не так? :)
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение Muerto Пт апр 17, 2009 13:19

Пока толком не смотрел, но заранее заинтересовался строчкой <BODY onLad="javascript:min_width()">
Nadie hablara de nosotras cuando hayamos muerto.
www.muerto.ru
Аватара пользователя
Muerto
Растаман
 
Сообщения: 3597
Зарегистрирован: Пн окт 11, 2004 19:09
Откуда: Москва

Re: Вечная тема: CSS и IE

Сообщение Muerto Пт апр 17, 2009 13:22

<div id='cont'> не закрыт вроде...
Дописано после:
Не, закрыт.
Но скрипта, который ты пытаешься загрузить в онЛоад, я всё равно не вижу в коде.
Не читал предыдущие посты - он там, вообще, нужен? Если да, то его и на онРесайз боди надо вешать.
В общем я мало понял шаманства тутошнего, но если убить экспрешн на #cont-pravo и поместить его на body c цифирками: #width:expression(document.body.clientWidth < 1024 ? "1024px" : "auto"); то всё в ИЕ6 работает нормально.
Ну и строка html{margin:0;padding:0;} - забыл двоеточие.
Nadie hablara de nosotras cuando hayamos muerto.
www.muerto.ru
Аватара пользователя
Muerto
Растаман
 
Сообщения: 3597
Зарегистрирован: Пн окт 11, 2004 19:09
Откуда: Москва

Re: Вечная тема: CSS и IE

Сообщение IceBerg Пт апр 17, 2009 13:35

Упс, сенкс. Это остался мусор. Скрипт. разумеется был. Я его убрал. а из body не убрал. Если смогу допинать сайт без него то - не нужен :)

cont - закрывается. Я, тоб не упустить эти дела. обычно ставлю комменты:

Читаем по коду:

Код: Выделить всё
<div id='cont'>
  <div id='cont-levo'>
    ... код ...
  </div><!--/cont-levo-->

  <div id='cont-pravo'>
    ... код ...
  </div><!--/cont-pravo--><br class='clearer'>
</div><!--/cont-->


Так что уплывающий все еще текст - мистика для мну
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение Muerto Пт апр 17, 2009 13:57

См. правки в моём последнем посте.
Nadie hablara de nosotras cuando hayamos muerto.
www.muerto.ru
Аватара пользователя
Muerto
Растаман
 
Сообщения: 3597
Зарегистрирован: Пн окт 11, 2004 19:09
Откуда: Москва

Re: Вечная тема: CSS и IE

Сообщение IceBerg Пт апр 17, 2009 14:28

Muerto, двоеточие в са деле проморгал. убрал экспрешн в cont-pravo, добавил его в body. Не работает эта скотина ни в ИЕ6, ни в ИЕ7 :(
Точнее, горизонтальный скролл появляется, конечно, но текст в контейнере cont-pravo продолжает масштабироваться - сужаться вместе с ужимающейся шириной окна ИЕ.
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение Muerto Пт апр 17, 2009 15:28

В скайп пиши...
Добавлено позже:
Когда-нибудь я обязательно шаманский бубен на своём сайте сделаю для таких случаев.
Nadie hablara de nosotras cuando hayamos muerto.
www.muerto.ru
Аватара пользователя
Muerto
Растаман
 
Сообщения: 3597
Зарегистрирован: Пн окт 11, 2004 19:09
Откуда: Москва

Re: Вечная тема: CSS и IE

Сообщение IceBerg Пт апр 17, 2009 18:54

БЛагодобря Muerto проблема решена. Всем спасибо.
Вот, я снова у вас...
IceBerg
Аватара пользователя
IceBerg
Дарю хорошее настроение
 
Сообщения: 377
Зарегистрирован: Вт фев 20, 2001 1:01
Откуда: Moscow

Re: Вечная тема: CSS и IE

Сообщение Alkeeper Пт апр 17, 2009 19:57

Muerto писал(а):Когда-нибудь я обязательно шаманский бубен на своём сайте сделаю для таких случаев.

Нахуй?
80 лет в интернете.
Аватара пользователя
Alkeeper
Экс-курильщик
 
Сообщения: 4183
Зарегистрирован: Вт ноя 13, 2001 1:01
Откуда: mweb

Re: Вечная тема: CSS и IE

Сообщение Muerto Пт апр 17, 2009 21:44

Alkeeper
Не, я натурально, сделаю на сайте шаманский бубен в который надо стучать дабы умаслить вебдухов. Сегодня на работе полчаса решали проблему на сайте, которой в принципе не может быть, потому что не может быть никогда. Проблему решили. И решили весьма идиотским способом. Черное колдунство и ничто иное.
А ссылка интересная. Попробую на досуге.
Nadie hablara de nosotras cuando hayamos muerto.
www.muerto.ru
Аватара пользователя
Muerto
Растаман
 
Сообщения: 3597
Зарегистрирован: Пн окт 11, 2004 19:09
Откуда: Москва

Re: Вечная тема: CSS и IE

Сообщение Alkeeper Пт апр 17, 2009 21:51

Muerto писал(а):И решили весьма идиотским способом. Черное колдунство и ничто иное.

Ты не поверишь, у меня такое случается почти каждый день =)
З.Ы. Если уж я hr-ы вертикально ставил...
80 лет в интернете.
Аватара пользователя
Alkeeper
Экс-курильщик
 
Сообщения: 4183
Зарегистрирован: Вт ноя 13, 2001 1:01
Откуда: mweb

Re: Вечная тема: CSS и IE

Сообщение Muerto Пт апр 17, 2009 21:56

Alkeeper
Да у меня тоже. Просто работа новая. Вот первая такая здесь возникла. Почин, так сказать.
Nadie hablara de nosotras cuando hayamos muerto.
www.muerto.ru
Аватара пользователя
Muerto
Растаман
 
Сообщения: 3597
Зарегистрирован: Пн окт 11, 2004 19:09
Откуда: Москва

Re: Вечная тема: CSS и IE

Сообщение Alkeeper Пт апр 17, 2009 22:05

Muerto писал(а):Просто работа новая.

А я вот все не дождусь, когда ж ты технологом к Лебедеву или в Яндекс уже попадешь, зело часто меняешь знаменитые компании =)
80 лет в интернете.
Аватара пользователя
Alkeeper
Экс-курильщик
 
Сообщения: 4183
Зарегистрирован: Вт ноя 13, 2001 1:01
Откуда: mweb

Re: Вечная тема: CSS и IE

Сообщение Muerto Сб апр 18, 2009 13:30

Не, эти конторы высосут досуха и вышвырнут. А мне надо такую, чтобы мог пьяным на работу заваливаться и левак успевал ещё там делать. Чтобы мозг не парили и денежек нормально платили. %) Вроде, тьфу-тьфу, нашел себе такую.
Nadie hablara de nosotras cuando hayamos muerto.
www.muerto.ru
Аватара пользователя
Muerto
Растаман
 
Сообщения: 3597
Зарегистрирован: Пн окт 11, 2004 19:09
Откуда: Москва

Re: Вечная тема: CSS и IE

Сообщение Padonak Сб апр 18, 2009 21:55

Сейчас этот форум просматривают: Google [Bot], Padonak и гости: 1
==========
надеюсь што гость - не новый работодатель Муерты :-))
Uncaught TypeError: Изображение

Изображение
Аватара пользователя
Padonak
Философ-разговорник
 
Сообщения: 3872
Зарегистрирован: Вт дек 13, 2005 3:23
Откуда: Ростов-на-Дону


Вернуться в Архив

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

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 1

cron