Правильно ли, что blueprint css позволяет вам формулировать макет в виде сетки, а не в виде поплавков?

Question

Один из аргументов, которые я слышал о blueprint css, заключается в том, что он позволяет вам думать о вашем макете с точки зрения сетки, а не с плавающей точкой. Это кажется большим преимуществом для меня, потому что я всегда путаюсь с тем, где мои поплавки будут заканчиваться - иногда поплавок неожиданно падает ниже некоторых других поплавков, и мне трудно разобраться, как изменить положение всего. Делает ли это Blueprint CSS хорошим выбором для меня - или я просто должен уделить время тому, чтобы научиться правильно использовать поплавки и делать все мои макеты вручную?

Answer 1

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

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

Answer 2

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

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

Answer 3

Я редко использую поплавки над абсолютным позиционированием по разным причинам.

Answer 4

Как уже говорилось, BluePrint - это система сетки, но она основана на плавающих элементах CSS. Так что понимание CSS Floats несколько важно, чтобы действительно понять, что делает BluePrint.

Answer 5

Под капотом Blueprint по-прежнему используются поплавки.

Вот новый подход к созданию «без плавания» макетов, которые являются семантическими и доступными, http://www.tjkdesign.com/articles/css-layout/no_div_no_float_no_clear_no_hack_no_joke.asp