Задача

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

Бывает при выводе информации требуется ее декорировать для лучшего восприятия, нередко оформление сопровождается в том числе и текстом. При выделении и копировании этой информации, оформление копировать не нужно, т.к. нужна только сама информация, и желательно в исходном виде. То есть при копировании часть выделенного текста не должна попадать в буфер обмена.
В моем случае это исходный код, который сопровождается нумерацией строк, так нагляднее и есть возможность сослаться на строку кода. Однако, если мы хотим скопировать часть кода, то он должен копироваться без номера строки.
Многие highlighter'ы этим грешат, при копировании кода копируют в том числе и номера строк. Выходят из ситуации по разному: либо используют хитрую верстку, при которой возможно несовпадении нумерации со строками (можно заметить на github например), или используют специальную кнопку, которая показывает в отдельном окне код без форматирования. Мне показались эти подходы неудовлетворительными, потому решил найти другое решение.
В данной заметке я опишу решение, к которому в итоге пришел. Решение, конечно, частное, но может кому то оказаться полезным в решении собственных задач.

Довольно часто наши клиенты устраивают регулярные рассылки с новостями. Почти всегда их не устраивают текстовые рассылки или простое оформление HTML рассылок. Наши дизайнеры вовсю креативят, а мы потом набиваем шишки при верстке их макетов с корректным отображением во множестве почтовых клиентов.

Ниже список встретившихся нам особенностей и способы их разрешения (как то упорядочить их мне не удалось, поэтому всё идет единым списком)

Уже было несколько статей, где авторы рассказывали о том как скрасить консольные будни с git. В последней приведенной ссылке автор предлагает создавать алиасы, для работы c git, непосредственно в shell. Это не очень хороший способ, хотя бы потому, что, например алиас gc будет конфликтовать с одноименной командой пакета graphviz. git сам прекрасно умеет работать с собственным алиасами.

Здравствуй, Хабр.

Иногда, знаете ли, хочется поделиться какой-нибудь ссылкой или двумя, причём никак с друг другом не связанными, или высказать мысль, но такую маленькую мыслишку, которая на пост не потянет. В общем, будучи верным принципу «нереализованные желания рождают комплексы» я сейчас поведаю вам о по-моему наиболее логичном способе использования chrome apps в хроме и поделюсь несколькими полезными ссылочками, но сделаю это несколько необычным способом.

Сперва, хотелось бы сказать огромное спасибо за корректное объяснение причин проблемы хабраюзеру xn__p2a и принести извинения другим хабраюзерам за некоторую некомпетенцию в вопросе, имевшую место.

Наверное, все пользователи этого браузера не раз сталкивались со следующей проблемой: при попытке скачивания файла получаем следующее:

в очередной раз я словил этот баг когда захотел скачать flash player через только_что_поставленную Opera 10.60 и меня это сильно огорчило…

Команда Яндекс.Почты объявляет о начале открытого бета-тестирования нового интерфейса. Переключиться на него уже сейчас может любой желающий (в настройках почтового ящика).



Ещё и года не прошло с запуска предыдущей версии — Нео, — а мы уже готовим новую.

Что же изменилось?

Мы нарисовали новый дизайн. Более лёгкий и удобный. Более простой.
Но главные изменения находятся  «под капотом». Если визуально всё вроде похоже на Нео — папки слева, письма справа, кнопки сверху, то внутри все изменилось полностью.

Вероятно, многие из вас используя css-expressions сталкивались с проблемой периодического появления сообщения abort. В народе поговаривают, что связано это с изменением DOM-дерева до его готовности.

Я тоже сталкивался и, не долго думая, решил написать небольшую «обертку» для expression’ов, которые я часто использую, учитывающую готовность DOM, упакованную в файл стилей.
Оную вашему вниманию и представляю.

Если Вы веб-разработчик, то у вас наверняка возникала необходимость в том, чтобы запретить пользователю выделение текста. Оговоримся, что я не имею ввиду полный запрет с целью защиты текста, а запрет на выделение всевозможных подписей, надписей и т.п. где выделение мешает работе интерфейса и пользователю (чаще всего при drag&drop, или выделении текста при двойном клике). Это в первую очередь касается веб-приложений и ни в коем случае не касается информационных сайтов.

Год назад мы с командой решили перейти с SVN на Git. Зачем это было надо — писать не буду, т.к. на эту тему уже и так много написано. А хочу я описать типичные алгоритмы работы, понятные человеку, который долгое время пользовался SVN. Ниже — памятка, написанная для команды год назад, чтобы легче было мигрировать. Надеюсь, кому-нибудь пригодится.

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

Первая типографская революция произошла во Всемирной Паутине настолько давно, что приходится производить поиски, чтобы установить подробности. Кажется достоверным то, что пишет Ian Graham: в Netscape Navigator 2.0 впервые появился элемент <font> (тогда он позволял задавать только размеры шрифта, и только в условных единицах), а в Internet Explorer 3 у этого элемента появился атрибут face, позволявший задавать начертание, задавать шрифтовое семейство. Википедия подсказывает, что Netscape Navigator 2.0 появился в марте 1996 года, а Microsoft Internet Explorer 3 — в августе того же года. В язык HTML версии 3.2 даже не входил атрибут face, хотя и упоминалося, что такой атрибут существует.

Тринадцать лет назад.

Все эти тринадцать лет для начертания текста сайтов в основном использовались несвободные шрифты, являющиеся частью операционных систем и офисных пакетов. Сайтам приходилося гадать о том, какие шрифты установлены у читателя, а какие не установлены, и какова вероятность того или другого, какие шрифты можно считать безопасными. Сочинялись специальные плагины jQuery и создавались специальные страницы, способные выяснить набор шрифтов на компьютере читателя. Особый дух того времени прекрасно передал despoth, сочинив превосходную серию статей о такой веботипографике, которая основана именно на подборе несвободных шрифтов (часть I — часть II — часть III — часть IV — часть V).

Наконец, это время кончилось: явствуют, зримо явствуют признаки Второй типографской революции, связанной с приходом @font-face.

Джон Даггетт сочинил познавательную статью о том, как все мы совсем скоро (после появления Safari 3.1, Firefox 3.5, Opera 10) сможем использовать загружаемые шрифты во всех популярных браузерах, а не только в одном наиболее популярном.

Марк Пилгрим грубо обрисовал ситуацию с лицензированием собственнических шрифтов. Ситуация эта немало напоминает глухой тупик. Даже создателям прекрасной демонстрации возможностей Firefox 3.5, чтобы изготовить страницу, пришлось специально связаться со шрифтопроизводителями и изготовлять такие особые (усечённые) версии использовавшихся шрифтов, чтобы их не было смысла копировать нелицензионно. А вон там предлагают раздавать особые паутинные обкусанные ужатые копии купленных шрифтов (которые сам покупатель вывешивать не имеет никого права, а только ссылаться). Остроумно. Открывает широкую дорогу в сторону Большого Брата: типа как недавно читальники Kindle удаляли книги Оруэлла за нелицензионность (даже честно купленные — просто оставляя стоимость их на счету покупателя в уплату). Так и тут. Внешний шрифт может неожиданно подохнуть, даже купленный заранее.

Всё это значит, что одновременно с переходом к использованию загружаемых шрифтов состоится, вероятнее всего, и переход к бесплатным (а в идеале — даже и свободным) шрифтам в Паутине.

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

Я собираюсь поэтому перечислить прямо тут все свободные шрифты, подходящие для использования на сайтах, написанных по-русски. Не стесняйтеся дополнять мой список.

Статья является расширенным сборником CSS-хаков в сравнении с аналогичной статьей.
Под хаком подразумевается метод, позволяющий воспринимать CSS только определенному браузеру.
Хаки могут использоваться не только для исправления багов в верстке, но и в случае использования определенных особенностей браузера для ускорения рендеринга web-страницы в нём (к примеру CSS3-свойства)

Существует довольно много способов локализации XSLT-шаблонов, некоторые способы описаны студией Лебедева, но сегодня я расскажу о локализации с помощью сущностей.

ENTITY

C начала о том, что же такое «сущности», не углубляясь в DTD. Сущности — это своеобразные константы в XML-документе, описываемые с помощью DTD, и используемые в качестве сокращений. Примером такой замены могут служить буквенные обозначения символов, не присутствующих на стандартной раскладке клавиатуры (©, ®, ₤ и т.д.). Сущности описываются следующим образом:

В этом посте я постарался собрать все известные мне хаки для css. Многие могут усомниться в их надобности для нормальных современных браузеров, потому как большинство хаков всегда применялись только для IE, но этот пост скорее для любознательных :), в верстке хаки вообще лучше не использовать. Но так или иначе, раз они есть, грех о них не знать.

В отличие от многих хаков для той же Opera, которые также будут обработаны и Safari, я немного изменил код и Opera 9.2, Opera 9.5 и Safari 3 увидят каждый свой css.

Шрифты в Em/% хороши всем — возможностью пользователей IE увеличивать кегль, заботой о пользователях, что предпочитают увеличивать размер шрифта браузера по-умолчанию, чтоб лучше видеть текст, да и просто являются нормой для профессиональных верстальщиков.

Минусы: … их вроде как нет, но!
А что если у пользователя разрешение экрана выставлено не в стандартное 96 dpi, а в 120?
Сайт с увеличенными шрифтами смотрится уже не так красиво, как нарисовал дизайнер — ведь масштабируются только шрифты, а не весь сайт! А разрешение 120dpi становится всё популярней, особенно на ноутбуках! Что же делать? Возвращаться к px?

Нет!

Как бы вы не относились к iPhone, вы не можете отрицать, что этот телефон захватил хороший кусок рынка мобильных устройств. И, по моему мнению, именно он дал возможность нормально пользоваться интернетом с телефона. Но хотя встроенный safari полноценен (спасибо, Webkit), многим хочется сделать специальную версию сайта для iPhone, выглядящую как настоящее айфоновское приложение (например, iweather.yandex.ru).
  
Одной из наиболее популярных библиотек для создания адаптированной версии сайта является iUI.

В сети доступно масса документации по языку XSL. Данный раздел не претендует на роль документации по языку, а лишь кратко, по шагам объясняет, как создать свой XSLT-шаблон.

Описанная ниже схема успешно мною используется уже более 3 лет. По началу я к XSLT относился с большой опаской (особенно, когда разбирал чужие исходники), однако однажды поняв, что к чему, уже не представляю, как без него можно работать.

По следам хабралинча имени Рюмкина коснёмся темы правильного типографического оформления чисел. В голову пришли следующие темы, если что-то вдруг забыто — пишите в комментариях, добавлю в статью.

• Минускульные и маюскульные цифры
• Целые числа и десятичные дроби
• Простые дроби
• Буквенные сокращения (тысяча, миллион, миллиард)
• Диапазоны
• Порядковые числительные и числительные в составе сложных слов

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

Всем известно, что на маках замечательный рендеринг шрифтов ;) Но, к сожалению, на темном фоне при сглаживании «Medium» текст выглядит очень жирным, что меня, мягко говоря, раздражает. Вот, например, кусочек меню Smashing Magazine с рендером по-дефолту:



К счастью, я нашел обходной путь этой проблемы. Заключается он в следующем: если указать тень (параметр text-shadow), то для текста с тенью включается «фотошоповский» рендеринг без субпиксельного сглаживания (Standard в System Preferences/Appearance). И никто не мешает нам сделать нулевую тень :)

Прописываем в CSS элементам такой параметр: text-shadow: #000 0 0;. Смотрим:



Вуаля! Надеюсь, этот трюк поможет эстетствующим любителям шрифтов и Сафари :)

UPD: Если вас смущает ругающийся валидатор, то могу сказать, что это баг самого валидатора, который проверяет CSS2.1, т.к. параметр text-shadow является валидным и присутствует в спецификации CSS2 и CSS3. Решение проблемы — в More Options валидатора выбрать Profile: CSS version 2 или CSS version 3.