Допомагаємо ЗСУ!

Консультации и оценка качества html-вёрстки (бесплатно)

🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада

Del

Статус: Offline
Реєстрація: 06.12.2003
Повідом.: 1529
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #1
Консультации и оценка качества html-вёрстки (бесплатно)

Пишите в топик - постараюсь решить/ответить на вопрос.

Серьёзно занимаюсь вёрсткой с 2006 (до этого было for fun), 4 года был PM, сейчас возвращаюсь в разработку. Подробней проф. пригодность можно оценить
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
и
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
.

Топик решил поднять чтоб не терять скилл в отсутствии работы "руками" да и интересные вопросы заставляют
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
в тех областях, в которые иначе углублялся бы только по делу.

Также можем разбирать уже готовую вёрстку: что хорошо, что плохо, как сделать лучше. Если вам кто-то сверстал сайт - тоже можно смело спрашивать - "ну как?"
 
Останнє редагування:
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #2
Круть. чувак молодец. спасибо за тему. собираюсь вплотную заняться версткой. вот только дойду до конца Соло на клавиатуре и тогда держись. :D.
Р.S. надеюсь не закиснет тема и сдержишь обещание:yahoo:
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #3
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.


Два баннера (под модулем "последнее с форума") во всех браузерах отрисовываются как и должны.

В грёбаном ИЕ внизу по центру страницы. Всю голову уже поламал.
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #4
+ в IE8 проблемы сменю
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #5
Под грёбанным IE как я понял имеется в виду 6-ой и 7-ой?
В IE8 баннеры отрисовываются где надо:
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.


Если в 8-ке у вас таки отрисовываются не так, то проверьте что этот сайт у вас не включен в Compatibility View и галочка "Display all websites in Compatibility View" выключена:
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.


Также Compatibility View будет включаться если вы просматриваете сайт локально или по локальной сети. Проверить режим отобраения можно нажав F12 в IE8.
В строке меню появившегося окна должно быть: "Browser Mode: IE8", "Document Mode: IE8 Standarts":
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.


Чтобы в IE8 сайт всегда отрисовывался в стандартах а не в IE7 mode или Quirks mode нужно либо добавить в head строку
HTML:
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
(она должна быть самой первой после открытия head, это важно!)
либо отправлять header через .htaccess:
Код:
<IfModule headers_module>
  Header set X-UA-Compatible: IE=edge 
</IfModule>
или через PHP:
PHP:
header("X-UA-Compatible: IE=edge");

Кстати в вас в head есть строка
HTML:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
удалите её.
во-первых она не работает (т.к. идёт после favicon)
во-вторых зачем сбрасывать IE в режим совместимости с IE7, это ж самому себе проблемы создавать.

Теперь исправляем баг с баннерами в IE6/7:
(кстати это не совсем проблема IE, там получается что блок с баннерами обтекает новость, если новость убрать он улетит влево и в остальных браузерах:
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
)

в style.css
строку 41 меняем с
HTML:
.banner { width:870px; height:150px;}
на
HTML:
.banner { clear: both; width: 250px; height:150px; margin-left: auto;}

Теперь проблема с меню в IE:
в style.css
после строки 16
HTML:
.menu { width:672px; margin:0 auto; margin-left:10px; }
дописываем
HTML:
.menu a {display: block;}
.menu a div {position: relative;}
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #6
Уважаемый Дел! Не подскажете ли как подключить БД Аксесс к сайту на Джумла? Хотелось бы сделать так, что бы пользователи могли просматривать записи в виде форм, а таблицу в целом что бы было не видно, или видно только зарегистрированным пользователям. Спасибо.
З.Ы. БД из сети не нужно редактрировать либо пополнять, это будет контент сайта, т.е. сайт нужен что бы демонстрировать содержание этой БД.
 
Останнє редагування:
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #7
Не подскажете ли как подключить БД Аксесс к сайту на Джумла?
к сожалению не мой профиль, это к программерам.
вот если - как сверстать какой-то хитрый блок, почему в каком-то браузере что-то криво отображается, как оформить версию для печати, как поместить альтернативное содержимое вместо флеша тем кто смотрит сайт на iPhone, как разметить таблицу чтоб она была читабельной для слепых пользователей и т.п. - это всегда пожалуйста.
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #8
Уважаемый Дел! Не подскажете ли как подключить БД Аксесс к сайту на Джумла? Хотелось бы сделать так, что бы пользователи могли просматривать записи в виде форм, а таблицу в целом что бы было не видно, или видно только зарегистрированным пользователям. Спасибо.
З.Ы. БД из сети не нужно редактрировать либо пополнять, это будет контент сайта, т.е. сайт нужен что бы демонстрировать содержание этой БД.

ну вот, как человек предложил свою помощь, так айда закидаем его тупыми вопросами...
смотрите сюда:
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
гугл никто не отменял.
либо экспортируйте вашу базу в MySQL и не мучайтесь, если она не меняется.
если меняется, можете экспортировать ее периодически.
заведите отдельную тему там и обсудим.

Пишите в топик - постараюсь решить/ответить на вопрос.

Серьёзно занимаюсь вёрсткой с 2006 (до этого было for fun), последний год - PM, подробней проф. пригодность можно оценить в профиле на
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
.

Топик решил поднять чтоб не терять скилл в отсутствии работы "руками" да и интересные вопросы заставляют
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
в тех областях, в которые углублялся бы только по делу.

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

пока что я видел только варианты "никак", "жабаскриптом", "создать видимость фоновой картинкой" и "что-то такое есть в новых стандартах, но в ИЕ все равно не работает".
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #9
к сожалению не мой профиль, это к программерам.
вот если - как сверстать какой-то хитрый блок, почему в каком-то браузере что-то криво отображается, как оформить версию для печати, как поместить альтернативное содержимое вместо флеша тем кто смотрит сайт на iPhone, как разметить таблицу чтоб она была читабельной для слепых пользователей и т.п. - это всегда пожалуйста.

Что ж, спасибо за вежливый ответ.



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

простите, у меня очень тупой вопрос.
"Попрошу не обобщать!" © - не помню откуда.:)
А если серьезно - неужели никто не встречал такой проблемы - продемонстрировать систематизированную информацию на Джумла-сайте?
 
Останнє редагування:
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #10
А если серьезно - неужели никто не встречал такой проблемы - продемонстрировать систематизированную информацию на Джумла-сайте?

заведите, пожалуйста, отдельную тему и объясните там, в чем проблема. я ее пока в упор не вижу.
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #11
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #12
как без таблиц сделать, чтобы две (и более) колонок были всегда одинаковой высоты, автоматически подстариваемой под содержимое максимальной?

пока что я видел только варианты "никак", "жабаскриптом", "создать видимость фоновой картинкой" и "что-то такое есть в новых стандартах, но в ИЕ все равно не работает".
вариант, подразумевающийся стандартами это задание колонкам display: table-cell. Но это не подерживает IE<8. C одной стороны вот-вот уже IE9 выйдет, с другой - как минимум IE7 ещё рано списывать.

Второй вариант - помещать вторую колонку внутрь первой, и через position: absolute растягивать её по высоте и смещать в сторону.
Всё отлично, но один блок вложенный в другой, если это не смущает - отличный вариант. Тем более блоки можно расставить в произвольном порядке (вложенный блок может быть и сверху и снизу).

Два года назад я пробовал сделать следующий финт:
  • для современных браузеров - display: table-cell
  • для IE6/7 - float + width через expression
тогда столкнулся с двумя проблемами: в FF3.1, он при первой загрузке ставил колоки одна под другой, и в IE6/7 бывает приходилось дописывать в expression дополнительные минус пикселей 5, а то колонки не помещались. Из-за этого русскоязычную статью не написал, но есть краткий вариант на бусурманском:
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.


Среди неназванных вами есть ещё способ через padding-bottom: 32768px, margin-bottom: -32768px, но имхо это изврат.

Резюмируя, лучше всего:
  1. или faux columns (подкладываем картинку, имитирующую колонки)
  2. или его вариация с наложением border (у левой колонки border-right, у правой - border-left, правый блок смещаем на -1px влево, рамки накладываются друг на друга - визуально, как-будто кологки)
  3. или одна колонка вложенная в другую и position absolute

Ну и не загорами IE9, закапывание стюардессыIE6/7 и светлое будующее table-cell :)

Ах, да ещё вариант есть через display: inline-block, но он тоже не без греха.
 
Останнє редагування:
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #13
вариант, подразумевающийся стандартами это задание колонкам display: table-cell. Но это не подерживает IE<8. C одной стороны вот-вот уже IE9 выйдет, с другой - как минимум IE7 ещё рано списывать.

Второй вариант - помещать вторую колонку внутрь первой, и через position: absolute растягивать её по высоте и смещать в сторону.
Всё отлично, но один блок вложенный в другой, если это не смущает - отличный вариант. Тем более блоки можно расставить в произвольном порядке (вложенный блок может быть и сверху и снизу).

Два года назад я пробовал сделать следующий финт:
  • для современных браузеров - display: table-cell
  • для IE6/7 - float + width через expression
тогда столкнулся с двумя проблемами: в FF3.1, он при первой загрузке ставил колоки одна под другой, и в IE6/7 бывает приходилось дописывать в expression дополнительные минус пикселей 5, а то колонки не помещались. Из-за этого русскоязычную статью не написал, но есть краткий вариант на бусурманском:
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.


Среди неназванных вами есть ещё способ через padding-bottom: 32768px, margin-bottom: -32768px, но имхо это изврат.

Резюмируя, лучше всего:
  1. или faux columns (подкладываем картинку, имитирующую колонки)
  2. или его вариация с наложением border (у левой колонки border-right, у правой - border-left, правый блок смещаем на -1px влево, рамки накладываются друг на друга - визуально, как-будто кологки)
  3. или одна колонка вложенная в другую и position absolute

Ну и не загорами IE9, закапывание стюардессыIE6/7 и светлое будующее table-cell :)

Ах, да ещё вариант есть через display: inline-block, но он тоже не без греха.

спасибо, то что нужно.
я грешным делом почему-то думал, что table-cell не работает даже в IE8.
наша жизненная позиция какбе "ваше IE7 не наша проблема".
так что table-cell подходит.
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #14
<link type="text/css" href="style.css?prefect=1">
Может вопрос тупой, но что может означать предача параметра prefect=1?
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #15
<link type="text/css" href="style.css?prefect=1">
Может вопрос тупой, но что может означать предача параметра prefect=1?

вопрос точно не по верстке.
может автор хотел сказать "prefetch=1"?
ознчает оно точечку во лбу, если style.css - файло на сервере.
если же CSS генерирует скрипт (ОМФГ??!), то объяснение очевидно внтури него.
есть еще небольшая вероятность, что параметр обрабатывется в .htaccess... зачем??
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #16
спасибо, то что нужно.
я грешным делом почему-то думал, что table-cell не работает даже в IE8.
наша жизненная позиция какбе "ваше IE7 не наша проблема".
так что table-cell подходит.
на сайте
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
есть хорошие таблички "когда же долгожданная фича появится во всех браузерах".

<link type="text/css" href="style.css?prefect=1">что может означать передача параметра prefect=1?
вероятно это используется для сброса кеша css на клиенте.
Если цифры в GET-параметре меняются, то пользователь каждый раз будет загружать css заново. Если не меняются - то лишь у части юзеров (афаик у тех кто сидит через прокси, может ещё в каких случаях).
Смысл сего малопонятен - сейчас клиентская оптимизация, борьба за секунды, кеширование, gzip всего и вся это тренд, гугль даже ранжирует тормознутые сайты ниже.
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #17
про кеш не подумал, спасибо
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #18
на сайте
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
есть хорошие таблички "когда же долгожданная фича появится во всех браузерах".
оу!
 
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #19
там кстати не всё показывается по дефолту, рекомендую попробовать повключать доп. галочки, как минимум "Unofficial / Note".

Вот ещё хорошая ссылочка на эту тему:
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
, тут в отдельности различные css selectors/declarations, js и вообще на этом сайте много полезной инфы.



и ах, да! как мог забыть -
⚠ Тільки зареєстровані користувачі бачать весь контент та не бачать рекламу.
, over9000 различнейших тестов, проверок, багов и их фиксов. Автор - просто нереальный задрот, в хорошем смысле этого слова!
Если в IE6/7 вдруг происходит какая-то неведомая фигня - надо искать её у Брунилдо, почти наверняка она там описана, протестирована во всех возможных вариациях и к ней найден workaround.
 
Останнє редагування:
  • 🟢 05:14 Відбій тривоги в м. Харків та Харківська територіальна громада.Слідкуйте за подальшими повідомленнями.#м_Харків_та_Харківська_територіальна_громада
  • #20
кстате, вот такой вопрос.
меня заломало выставлять в каждой ячейке столбца таблицы одну и ту же ширину и выравнивание.
вычитал про тэг col и вставил их перед thead, для каждого столбца прописал ширину и выравнивание.
ширина работает (причем как из аттрибута style так и из аттрибута width), а вот выравнивание - ни в какую. есть ли способ задавать его все-таки единожды для столбца?
 
Назад
Зверху Знизу