Использование box-sizing супер-полезным, особенно для мобильной и гибкой конструкции (например, получение полной жидкости полей формы с фиксированным количеством обивка является удивительным).Но я хитрый применяя его к everything.

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

Кресло критика этой техники будет скулить о выполнении универсальный селектор (*).Этот вой был в значительной степени развенчан.В то время как этот селектор технически “медленнее”, чем что-то вроде имя селектора класса, разница незначительна, за исключением крайних случаев чрезмерного или на страницах с миллиардами элементов.Делая что-то, что уменьшает один HTTP-запроса составляет по меньшей мере на порядок больше разницы, чем оптимизация selectors.

Для записи, полные и рекомендуемый синтаксис таков:

* { 
   -webkit-box-sizing: border-box; 
   -moz-box-sizing:    border-box; 
   box-sizing:         border-box; 
}

С этим, вы, по сути получите отличную поддержку браузера во всем — даже подавляющее большинство мобильных Webkits.Заметным исключением является IE 7 и ниже.Я не хочу, чтобы открыть банку с червями, но использование IE 7 уже низко и снижается гораздо быстрее, чем IE 6 было, поэтому поддерживает только IE 8 будет обычным очень soon.

Вот краткий грунтовки о том, почему с помощью этого окна модель хороша:

• Теперь, когда вы установите ширину и высоту, элемент всегда будет, что ширина и высота, независимо от заполнения и borders.
• Это делает математику намного проще.Например, вы могли бы легко сделать из четырех столбцов сетки, сделав ширину каждого столбца 25%, а плавающая них.Вы могли бы сделать водостоки из пикселей обивка и не беспокоиться, что они будут расширять столбцы и сломать grid.
• Это также дополнительная полезная для текстовых областей, которые вы хотите, чтобы заполнить ихродителей ширины, которые можно сделать, только установив их ширину до 100%.Но тогда вы не сможете иметь заполнение, если вы не использовали эту модель окна, чтобы они не выходит за пределы width.

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

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

CSS Sprites Workflow

Вопрос от банков Мэтт: