Архив рубрики ' CSS '

Украшаем input с помощью CSS. Продолжение.

Wednesday, May 7th, 2008

Сегодня продолжу мучать html тег input в целях улучшения его юзабилити. Начало можно почитать в статье “Украшаем input с помощью CSS”.

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

Украшаем input с помощью CSS

Friday, April 25th, 2008

Прежде чем что-то украшать, отвечу на вопрос зачем это делать. А делать это нужно для того, чтобы глазу было за что зацепиться, легче запомнить или представить для чего, собственно, именно это поле ввода, именуемове английским словом input, предназначено. Ну, и, конечно, для красоты :), от нее никуда не деться, она, как известно, спасет Мир!

Приступим. (more…)

CSS Naked Day!

Wednesday, April 9th, 2008

Уже третий год проводится CSS Naked Day, в этом году принять участие в нем решил и наш блог.

В чем суть мероприятия?

А состоит она в том, что нужно убрать со своего сайта css.

Для чего это нужно?

А нужно это для того, чтобы популяризировать веб стандарты и правильную, семантическую верстку. Объясню. Если Вы правильно сверстали, сохраняя семантику html, то Ваш сайт от отключения ничего не потеряет, все будет так же естественно выглядеть, заголовки - заголовками, списки - списками и т.д. Собственно это и можно наблюдать сегодня на этом блоге.

Более подробно о мероприятии можно почитать здесь.

Исчезающие блоки в Opera

Thursday, February 21st, 2008

Уж от какого браузера я и ожидал сюрпризов, так это точно не от Opera. А дело было так. Был обычный макет:

HTML:
  1. <div id="header"></div>
  2. <div id="wrapper">
  3.     <div id="right">
  4.         <ul id="menu">
  5.             <li></li>
  6.         </ul>
  7.     </div>
  8.     <div id="left"></div>
  9. </div>
  10. <div id="footer"></div>

Привел не весь макет, а большую его часть, чтобы Вы имели представление о нем. Тут нас интересует элемент с id "menu". Именно с ним в Opera и начались проблемы.

Выглядело это следующим образом:

menu in opera

Кажется, все хорошо, но если в браузере Opera воспользоваться скролингом, так чтобы меню оказалось не в рабочем окне, то при возвращении скролинга в исходное положение, меню исчезнет.

menu in opera with scroll

И в голову сразу лезут всякие нехорошие мысли о разработчиках браузеров. В частности Opera(Version 9.24, Build 8816), т.к. в Firefox и IE подобного не происходит.

Но стоит немного подумать - и в голове всплывает, что подобные чудеса не редки и в общелюбимом браузере IE 6. В народе эти чудеса получили название - IE6 Peekaboo Bug.

Поэтому, применив одно из средств для борьбы с подобным в IE6, баг был исправлен и в этом случае. А именно, исчезающему элементу было добавлено css свойство position: relative.

ul li баг в IE

Wednesday, January 23rd, 2008

Статью решил назвать "ul li баг в IE", хотя под это описание могут попасть много багов. Речь сегодня пойдет лишь об одном из них. А именно о непонятных отступах между элементами li. Рассмотрим следующий CSS и HTML код, который представляет из себя простое меню.

Сначала CSS: (more...)