MaxSite.org
Создание сайтов и html-курсы для новичков

Глюки, глюки…

CSS, HTML, LESS, SASS

Вчера до двух ночи бился с такой проблемой. Есть довольно простой html-шаблон, основанный на вот таком темплейте.

В нем используется такая хитрость: средняя колонка (1) (основной текст) расположен в файле перед сайдбарами (2 и 3). Сам по себе css-код очень простой и особых проблем быть не должно.

Но вот вчера, делая очередной сайт, я наткнулся на одну неприятность: в IE6 периодически исчезает левая колонка. То есть не «слетает», а именно исчезает (просто не видно). В остальных браузерах (IE7, FireFox, Opera, Safari Win) все работает корректно.

Вначале я решил, что дело в какой-то ошибке в коде. Перерыл все тексты, убрал все тэги и вот в процессе таких действий вдруг обнаружил, что одна и таже страница ведет себя по-разному. То есть при обновлении страницы (F5) левая колонка то показывается, то исчезает.

Никакой логики я здесь так и не обнаружил, за исключением того, что чем больше страница и чем дольше она грузится, тем чаще исчезает колонка...

Никто не сталкивался?

ps Плагины отключал, все тэги закрытые. ;)

Комментариев: 18 RSS

1DimaX20-11-2007 16:48

Конкретно по твоему шаблону не скажу (я вообще в дизе и цсс ниче не смыслю), но вот в том шаблоне, что у меня сейчас стоит, тоже наблюдаются некоторые глюки, похожие на твой :) Иногда как бы закрывается левый сайдбар, иногда не полностью, иногда блок адсенса привязывается к левому краю экрана, закрывая все что под ним, а в центре просто пустой квадрат :) и глюки только в ИЕ6

порефрешив может как появиться данный глюк, так и исчезнуть

в свое время убил кучу времени по победу над этими шутками, приглашал специалиста по этим делам, несколько глюков (не описанных выше) были побеждены, а эти так и остались, чел руками развел, хз говорит в чем проблема :shock:

2rurikus20-11-2007 17:15

Недавно сталкивался с похожей проблемой, и тоже именно в ИЕ.

Решение нашел благодаря генерации кода на одном из этих ресурсов, к сожаление точно не помню на каком из них. Попробуйте, может и Вам поможет.

http://www.inknoise.com/experimental/layoutomatic.php

http://csscreator.com/?q=tools/layout

http://www.qrone.org/cssdesigner.html

http://www.positioniseverything.net/articles/pie-maker/pagemaker_form.php

3Seroga20-11-2007 18:04

Сталкивался. Правда не сам верстал... И что еще хуже проблему так и не удалось решить. Т.е. редко, но глюк проявляется. См. www.ric.vsu.ru. Вообще у меня подозрение, что колонка не исчезает вовсе, а убегает за пределы экрана и именно когда страница долго грузится, а по F5 все встает на свое место.

4Александр М.20-11-2007 18:08

Попробуй сохранить страницу на компьютер после того как она загрузилась. И работай не с динамической, а с ее статической копией. Там есть кроме css еще и java?

5Александр М.20-11-2007 18:12

убегает за пределы экрана и именно когда страница долго грузится
Тогда остается предположить, что это не качественная прорисовка страницы при неполной загрузке. Снифером можно попробовать посмотреть загрузились ли ВСЕ последние закрывающие теги и целиком ли загрузился css. Попробуй временно очистить css от не важных тегов. Таких как шрифты, цвета и т.п. В общем - уменьшь его размер

6Tapac20-11-2007 18:53

Макс, пиши сразу же о таких проблемах на своём форуме со ссылкой на блог, который "тупит")

Там всегда помогут)))

7Максим20-11-2007 19:10

Думаю, что проблема в IE с его float'ом. Там вообще непонятная зависимость - беру добавляю большую (в кб) картинку в пост - колонка слетает гораздо чаще. Наверное нужно искать какой-то хак, но сейчас плюнул, сделал обычную схему: левая колонка, центральная, правая - так и грузятся. Эта схема работает без проблем.

ps rurikus, спасибо за ссылки.

8sanch3z20-11-2007 19:44

В ие6 бывает еще такой глюк: при большом уровне вложенности у блочных элементов пропадает часть бэкграунда. Это дефект рендеринга в ие.

9Dimox20-11-2007 22:45

Максим, наверное я знаю в чем, дело. Я тоже использую шаблон с того сайта, который ты указал (только резиновый) и некогда у меня была подобная проблема, которую я решил следующим образом.

Объясняю по исходному коду указанной тобой страницы.

Тебе нужно обернуть в дополнительный див блоки со следующими идентификаторами: #wrapper, #navigation, #extra, т.е. получится примерно так:

<div id="sub-container"> <div id="wrapper"> <div id="content"></div> </div> <div id="navigation"></div> <div id="extra"> </div>

Теперь нужно для блока "sub-container" указать ширину в 100%. Именно в последнем и заключается лекарство.

Надеюсь, что это тебе поможет.

10Dimox20-11-2007 22:56

Тогда остается предположить, что это не качественная прорисовка страницы при неполной загрузке.

Все дело в том, что Билл Гейтс делал всеми "любимый" IE6 через попу.

11Максим20-11-2007 23:30

Супер! :cool: Дима, где ж ты раньше был? :smile:

12Dimox20-11-2007 23:55

Вот и замечательно! Я очень рад, что помог ;).

Дима, где ж ты раньше был?

Выполнял твой заказ :))))) А только после этого ридер открыл и увидел знакомую проблему :).

14Dimox21-11-2007 00:16

Кстати, Максим, предлагаю еще прочитать мою статью как раз по этой теме - http://suprabiz.com/3_column_css_layout/

Плюсом к тому, что я уже выше сказал, в ней указан важный момент на случай резиновой верстки.

16mByte21-11-2007 15:20

для исчезающей колонки нужно поставить height: 1%;

17generator200316-12-2007 11:51

А что в таблицах сейчас уже никто не вестает ???

CSS только ??

Я пользую таблици а не CSS гемора с таблицами меньшне

чем CSS лучше?

18Tapac16-12-2007 16:00

generator, предлагаю сперва разобраться что такое CSS. А потом уже, обогатившись этим знанием, понять, что ваш вопрос совершенно бессмысленен.

После чего уже можете изучить различия табличной и div-ной вёрстки.

Оставьте комментарий!

Комментарий будет опубликован после проверки. Вы соглашаетесь с правилами сайта.

(обязательно)