問題タブ [singularitygs]

私はSingularityの旅を続けており、このフレームワークの実験を楽しんでいます。Sassmonster.comに実験的なサイトを作成しました( https://github.com/58bits/sassmonsterの Github リポジトリ)。

このフレームワークについて、他の「セマンティック」フレームワーク (この場合、それが適切な用語である場合)とFoundationやBootstrapなどのプレゼンテーション マークアップ フレームワークとの対比について議論していました。

Singularity (および元のSemantic Grid ) が採用するアプローチの相対的な利点を、マークアップにグリッド クラスや属性を必要とせずに誰かが要約できるかどうか疑問に思っていました。

私がこれを正しく理解していれば、主な利点は、ドキュメント ソースの順序や固定されたクラス属性に関係なくレイアウトを動的に変更できることです (たとえば、新しいグリッド レイアウトと特定のブレークポイントでのグリッド スパンの設定。サイドバーのようなソース順序に依存しない変更を含みます)。左側から右側に切り替えます)。

他にもあると思いますが、私よりも経験豊富な人からの要約に感謝します;-)

最後に、一般的なグリッド システムの将来に関して、CSS グリッド レイアウト モジュールの一般的な採用は、 Singularity のような時代遅れのフレームワークになりますか?

コンテンツと右側のパネルとして機能する 2 つのグリッド スパンのメイン レイアウトを使用しています。次に、コンテンツには、等しい列である 3 つのグリッド スパンがあります。1. 親スパン: 6 と 6 2. 最初の列の子スパン: 4 と 4 と 4

コンテンツの 3 列に grid-span を使用すると、3 つすべてにパディングがあり、最後の列のパディングが親コンテナーのパディングに視覚的に追加されて二重ガターが作成されます。

ただし、float-span を使用すると、3 つのコンテンツ列の最後の列にパディングがなく、最初の 2 つの列より視覚的に長く見えます。

cssオーバーライドでsingularitygsにハックすることなく、3つの子列すべてを同じサイズにし、パディングなしで3番目の列を持つ方法はありますか?

記事要素のラスターがあり、それぞれがイベントを表しています。チェックボックス ハックを介して、各イベントの追加コンテンツが展開され、マウス クリックで表示されます。問題は：

展開された記事のすぐ下にある同じ列の記事だけが押し下げられ、他の列の記事も押し下げられないということはどういうわけか可能でしょうか (イベント 4、赤いものなど)。

例 (sass、コンパス、特異点を使用) はgist https://gist.github.com/rpkoller/678e30212e9da8b41619として保存され、 sassmeister ではhttp://sassmeister.com/gist/678e30212e9da8b41619です(sassmeister の例にも問題があります同じコードでローカルに発生していない少し明確な問題はさておき)

現時点では、その問題を解決する方法がわかりません。各ヒントは大歓迎です。よろしくラルフ

Singularitygs のGrid Directionセクションを読みましたが、グリッドの方向を変更する方法がわかりませんでした。誰かが解決策を明確にしてくれませんか?

この要点を見てください： http://sassmeister.com/gist/6d575ec85663865fa567

そこでは、placehold.it によって実現されたサムネイル グリッドが表示されますfloat-span 。今必要なものは次のとおりです。

• 各行の最初の .item の padding-left は 0 にする必要があります

• 各行の最後の .item の padding-right は 0 にする必要があります

これは、残りのコンテンツ (例: lorem ipsum テキスト) と完全に一致するサムネイル グリッドに配置されます。

特異点でこれを達成するための獣の方法は何ですか?

更新日 2014 年 7 月 21 日

私が必要とするものは、この画面で見ることができます:

別のパディング スタイルは必要ありません。各行の最初と最後のアイテムのパディングを削除する必要があります。sass の計算が間違っているため、これは css を介して行うことはできません。

更新日 2014-07-30

さまざまなソースに基づいて、私はこのミックスインを確立することができました:

これは、たとえば次の方法で呼び出すことができます。

ここで例を見ることができます: http://sassmeister.com/gist/7a45960747ad3d4bbf56

Singluritygs と Breakpoints (応答が含まれています) を使用しており、これらのブレークポイントに従ってグローバルなガター幅を変更したいと考えています。

私はこれがうまくいくと思ったが、うまくいかない：

私はこれに間違った方法でアプローチしていますか?

グリッドの追加は、この手法を使用して機能することに注意してください。

現在、SGS のバージョン 1.2.1 を使用していますが、グリッド切り替え mixin が失敗していることに気付きました。

現在の WIKI ドキュメントによると、次のように述べられています。

グリッドのオンとオフを切り替えたい場合は、grid-toggleミックスインを使用できます。grid-toggle mixin は、セレクター内から使用しないでください。それはそれ自身を書くでしょう。

私にとって最も重要な部分は、次のように述べている 2 番目の文全体です。

grid-toggle mixin は、セレクター内から使用してはなりません (SHOULD NOT)。

実行するcompass:distと、次のようになります…</p>

未定義の mixin 'grid-toggle'

これは私の現在の SGS Sass ファイルhttp://codeshare.io/Ek0sHのコードシェアであり、リストされているそれぞれのバージョンで使用されている私の gem の別のコードシェアです。http://codeshare.io/NEzzr

Drupal ビューの出力で、こちらで説明されているように、 float-span を使用してクエリ結果のタイル グリッドを表示したいと考えています。

私が達成しようとしていることのより良い説明については、sassmeister css ソースのコメントを参照してください。

SassMeister でこの Gist を試してみてください。

どんな助けでも大歓迎です。

特異点を持つヘッダーの 2 つの要素を中央に配置したいと考えています。これは私が持っているhtmlコードです

そして、私が持っているsassコードは次のとおりです。

そのため、要素を中央に配置するためのより良い解決策があるかどうかを見つけようとします。

ロゴタイプは ID #block-block-5 にあり、メニューは ID #block-system-main-menu にあります

メニューは大きな問題です.4列または5列から始めても調整しないでください.少し余分なスペースがあり、中央に来ることはありません. この問題を解決するアイデアはありますか?