問題タブ [susy]

スージーを学び、愛しています。ただし、単純なことをテストしているときに、いくつかの癖があります。間にガタースペースがあり、その後に全幅の列がある2つの半幅の列を並べて作成しようとしています。問題は、後半の半幅列 (y) が完全に右に浮いていないことです。完全に削除した場合padding: 5px、その列はまだ1pxオフになっており、全幅の列と一致しません (z)

HTML

サス

出力されたコードの jsfiddle は次のとおりです。

JSFiddle

なぜうまく整列しないのですか？

おそらく Susy 自体の問題ではありませんが、適切に使用していますか? 同じことを行い、それ自体を右にフロートさせるより良い方法はありますか? 次のコードは、.right の同じクラスで float: left と float: right を出力しますが、不要のようです。

SUSY のギャラリー ミックスインを使用して、レスポンシブ グリッドで同じ高さの列を取得しようとしています。そのために、コンテナ「display: table」と列「display: table-cell」を設定しました。これは、ミックスインを使用しない場合はうまくいきますが、ミックスインをオンにするとすぐに失敗します。高さをピクセル単位で設定した場合、ミックスインは機能しますが、100% を使用して高さを設定した場合は機能しません。

私は使用しています：

• スージー (2.1.3) および
• サス (~> 3.3)

これは、SUSY の有無にかかわらず機能します。

これは SUSY では機能しませんが、mixin をオフにすると機能します。

水平レイアウトの間に垂直仕切りを追加する方法を見つけようとしています。3 つの列があり、中央の列の左右に仕切りが欲しいです。

通常、各要素の後にそれを描画し、最後から除外する:afterルールを CSS に追加しますが、問題は、Susy の関数が、要素間に 1 ピクセルの仕切りを追加するために利用可能なスペースを埋めてしまうことです。:last-childspan()

私のコードは次のようになります。

サス:

HTML:

私はスージーに頭を抱えようとしています。私はそれが好きになると思います。もっと操作する必要があります。私は基本的に、サイト全体で使用できる再利用可能な列を作成しようとしています。私は Foundation グリッドを使用しているので、これについて考えていないのではないでしょうか?

それらの列をターゲットにできる必要があります。column-2 や small-6 のようなクラスで div を埋めるべきではないという記事をいくつか読みました。私が期待していることを伝えないと、divをどのようにターゲットにしているのかわからないと思います。

以下のコードは機能しますが、非常に Susy ですか? それは正しいアプローチですか？12 列の幅すべてに対して同様のルールを作成する必要があります。それらの列をどのように分割するかを前もって決定する必要があります。スパン 6 列を 6 からミディアムまでスパンにするか、スパン 12 に変更するか。これらのルールは事前に決定する必要があります。

これが正しいアプローチでさえある場合。ヘルプ、ガイダンス、またはポインタをいただければ幸いです。

HTML

スージー・サス

これは、Susy 2 では理解できなかったものです。

この簡単な例を見ると、次のことがわかります。

http://codepen.io/itsthomas/pen/Btzxa

HTML:

サス:

$susy マップにglobal-box-sizing: border-boxを追加しても、 @include border-box-sizing; を使用するかどうかに関係なく、何も変更されません。あなたのコードであるかどうか。

$susy 設定の global-box-sizing は、私にはまったく役に立たないようです。それとも私は何かを見落としていますか？

ありがとう

Rails 4.1.1 を使用しています。そしてsassとsusyを使いたい。次の関連項目の助けを借りて: https://stackoverflow.com/a/26171101/2118999

以下のファイルを作成しました

私のscssファイルにファイルをインポートする;

の内容

base.css.scss にもコンパスをインポートしないと、動作しません

これは私のapplication.rbがどのように見えるかです:

これは私のgemfileです

base.css.sccs にコンパスを明示的にインポートしないと、compass/susy が機能しないのは奇妙だと思います。これは、base.css.sccs をインポートしているファイルが既にコンパスをインポートしていると思われるためです。

そして、私のapplication.rbでは、requireを「rails/all」と「susy」をモジュールの外側に配置する必要があります。そうしないと、機能しません。誰が私に何が起こっているのか説明できますか? ロジックを見るだけで、いつか壊れる非常に壊れやすい構造のように感じます..

よろしくお願いします、

マルティン

でガターを無効にする必要があることがよくありmargin-left: 0; margin-right: 0;ます。カスタムレイアウトのガターを0にしてみた

しかし、これはガター幅を 0 に設定するのではなく、ガターをまったく設定しないことを susy に伝えるだけです。

susy レイアウトでガターを 0 に設定するにはどうすればよいですか (単に null に設定するのではなく)?

Susy 2 のような単純な 3 列 / 3 行のグリッドを作成したい:

しかし、ブロックはバグのある異端の順序で浮かんでいます。ご覧いただけます: http://img.spheerys.fr/images/2015/01/05/bug-susy.jpg

ここに私のHTMLマークアップ：

ここに私のSusyマップ：

そして最後に、私の Sass :

何が問題なのですか?