Anton Bobylev

Если «фиксировать width не предлагать», то практически никак.
То, что шрифты рендерятся по-разному на различных ОС — известный факт и ничего с этим не поделать.
Если вам критичны размеры блоков до пикселя, то и управлять нужно ими (размерами блоков) напрямую. А если вы управляете ими косвенно (через размеры текста) — погрешности неизбежны.

Если бы был известен контекст задачи, то возможно, можно было бы подсказать какие-то половинчатые решения-костыли. Но именно в такой постановке — никак.

Сайты Google – это бесплатный способ создавать веб-страницы и предоставлять к ним доступ.
www.google.com/sites/help/intl/ru/overview.html

Логично, что селектор #id li будет выдавать вам ноды не только текущего списка, но и всех вложенных. Так что надо использовать #id>ul>li, примерно так: jsfiddle.net/DrqRu/

Большинство (перестраховка) популярных фреймворков имеют тот или иной вид ORM, позволяющий не задаваться (почти) вопросом где и как хранятся данные. Так же как имеют более-менее развитые средства работы с формами или даже генерации CRUD-интерфейсов. Отчёты — шаблонизаторы или сам PHP.

Чисто субъективно для бизнес-приложений посоветовал бы присмотреться к Symfony2(+Doctrine2+Twig). По-моему там сильнее всего идёт разделение бизнес-логики, представлений и логики приложения (роутинг, хранение и т. п.).

Решение, как обычно, нашлось там, где его никто не ждал. Надо использовать так называемый general sibling selector:

.item.active ~ .item.active:before {
    content: ', ';
}

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