問題タブ [css-frameworks]

div class = "grid_12"（メイン）で960gsの16列レイアウトを作成し、その後、grid_4（右）（12 + 4 ...）そのgrid_12内に3列スタイル（3個のgrid_4）が必要でした）。しかし、grid_4ボックスはgrid_12内に収まらず、最後のボックスは2番目の行にドロップします。

960gsフレームワークは私のためにこのレイアウトを行うことができるべきではありません、私は何かを逃しましたか？

前もって感謝します。

960GSのようなCSSフレームワーク用のCDNがあるのだろうか。多くの人がそれを使っていると思うので。

CSSに対する私の極端な不満は、さまざまなブラウザー（およびさまざまなバージョンのブラウザー-はい、IEについて話している）間でうまく機能できないことです。

人々はどのCSSフレームワークに出くわしましたか、そしてそれらの特定の利点のいくつかは何ですか？今日、オブジェクト指向CSSフレームワークについて聞いたのですが、まだ調べる時間がありません。

すべての一般的な CSS のベスト プラクティスを保持する CSS ライブラリを探しています。

たとえば、ブロックのセンタリング スタイル:

このようなライブラリを、プロジェクトに追加して使用できる個別の css ファイルとして配布したいと考えています。

さて、Less.js が登場しました。「抽象化された」CSS 言語を使用して CSS フレームワーク (特に「グリッド」システム) を作成するという私の夢が実現しようとしているようです。

つまり、960 とブループリントはどれも素晴らしいものです... しかし、次のようなスタイル情報を HTML マークアップに入れるのはとてもイライラしました。

または構文が何であれ:)

したがって、次の方法で実行できるようです。

うわーーーー！

だから、私は自分自身のためにこれを開発することに行き詰まろうとしています-しかし、私はすでにそれをやった頭脳派がそこにいると確信しています-だから、私が重いものを持ち上げる前に...?

手がかりはありますか？

親切に

ダリル。

LESS（.js）でグリッドフレームワーク（例：blueprint / 960.gs / ...）を使用したいのですが、そのようにすることにした場合、いくつかの問題があるようです。

たとえば、ブループリントの場合：ミックスインクラスがhtml要素に表示されない場合、iehacksスタイルシートはcontainer/span-Xクラスをミックスインとして使用できません。たとえば置く

.lessスタイルシートでは、つまりハックは適用されません（そしてそれは理にかなっています）。

だから私は誰かがすでに青写真または960gsをより少ないcssに「移植」したのだろうかと思っていましたか？私はグーグルを調べましたが、何も見つかりませんでした（私は自分で試しましたが、使用されているIE hacks / cssセレクターを考えると、変換は簡単ではありません）。

PS：別の質問はSOでも同様ですが、作成者は自分でフレームワークを開始することにしました。「人気のある」フレームワークを使用したいと思います。

編集：少ないファイル（ミックスイン）からクラスを適用するときの問題の例：960.gsには次のルールがあります：

html（簡略化）：

LESSを使用すると、次のようにスタイルシートでレイアウトを定義すると便利です。

しかし、それは機能しません（ルールはcol1とcol2には適用されません）。LESSには＃col1が#mainにあることについての手がかりがないためです（セレクター#main＃col1はトリックを実行しません、それはLESSの点からかなり複雑です見る）

既存のアプリのRailsCSSフレームワークの場合、どちらが好きですか？LESSまたはCOMPASS？

CSS に Blueprint や 960 などのフレームワークを使用することを検討するように言われました。

私が理解できないのは、2 人のユーザーの画面解像度が異なっていても、どのようにしてサイトが一貫して表示されるのかということです。

それはどのように機能しますか？

過去1年間で、私は大規模なWebアプリプロジェクトを管理するためのBluePrint.cssのファンになりました。960とYUIの製品も見てきました。すべて良いです（YUIについていくつか不満がありますが）。

私は現在モバイルプロジェクトに取り組んでおり、さまざまな画面サイズに対応する必要があることを考えると、cssグリッドフレームワークが再び進む方法だと思います。

BluePrintロジックを大幅に変更したり、ゼロから構築したりする可能性がありますが、その前に、モバイル用に特定のフレームワークを使用したことがあるかどうか、モバイル開発用に特定のフレームワークを推奨するかどうか疑問に思いました。

私はLessとcssgridを見てきました

http://lessframework.com/

http://cssgrid.net/

どちらもとてもいいです。Lessは一貫した列幅を使用し、列数を変更します。Cssgridは、画面サイズに対応するために流体カラムを使用します。一方、私は、固定数の列を使用し、画面の幅に基づいてその場で幅を調整する、さらに別の方法を想定しています。ネストが多いと流体グリッドの管理が難しくなる可能性があることがわかったので、このオプションを選択します。私が最初に見るべき他のオプションはありますか？

明確化：現時点では、必ずしも完全なUIフレームワークは必要ありません。jQueryであろうと私たち自身のものであろうと、間違いなく1つになりますが、現在の主な目標は、一般的なページレイアウトと、複数のモバイルデバイスの画面解像度と向きにわたる配置を処理するCSSフレームワークを見つけて構築することです。

サイトの CSS フレームワークとして 960.gs (http://960.gs) を使用しています。追加の 10 ピクセルの .grid_12 クラスではなく、.container_12 クラスの背景に色を付けようとしています。両側で、グリッドに呼吸するための少しの空白を与えます。

960.gs のサンプル サイトを見たところ、y 軸で背景が繰り返されており、.grid_12 または .grid_16 クラスのサイズや内容に関係なく拡大しているように見えます。

背景を白くペイントしたい場合 (y 軸で画像を繰り返すのではなく)、.grid_12 が浮いているように見えるため、.container_12 には高さがなく、白い背景がありません。

ここに私の関連するHTMLがあります

とCSS