Milligram: モバイルでのグリッドの動作

作成日 2018年01月12日 · 7コメント · ソース: milligram/milligram

バージョン情報

ミリグラム1.3

再現する手順

<div class="row">
<div class="column">test</div>
<div class="column column-20"">test 2</div>
</div>

予想される行動

他のcssフレームワークが行っているように、モバイルグリッドで100％の幅が見られると期待していました。

実際の動作

グリッドはパーセンテージ幅を維持しますが、2本の線上にあり、奇妙に見えます。

デスクトップ上

Desktop

モバイルで

Mobile

それに対する解決策はありますか、それとも期待される動作ですか？

Hacktoberfest improvement

ソース

dnohr

最も参考になるコメント

こんにちは@cjpatoilo 、

これらのフレームワークがそれを行っているようです：

モバイルの場合、解決策は「column-20」の幅を100％オーバーライドすることだと思います。それは可能でしょうか？

あなたの仕事をありがとう👌🏻

dnohr 2018年02月07日

👍2

全てのコメント7件

ねえ@dnohrグッドコール！

私はそのアイデアが本当に好きでした。実際、私はすでにそのようなものを想像していましたが、誰もがそれをそのように使用しているかどうかはわかりません。この情報をマッピングすることは興味深いでしょう。モバイルで100％使用しているCSSフレームワークを教えてください。

cjpatoilo 2018年02月07日

こんにちは@cjpatoilo 、

これらのフレームワークがそれを行っているようです：

モバイルの場合、解決策は「column-20」の幅を100％オーバーライドすることだと思います。それは可能でしょうか？

あなたの仕事をありがとう👌🏻

dnohr 2018年02月07日

👍2

@dnohrこのサポートを追加し、現在の動作を維持する方法を見つけました。 👍
この改善を報告していただきありがとうございます。

cjpatoilo 2018年02月16日

私は同じ問題を抱えていますか？
これをどのように解決しますか？

モバイルでは、グリッドが列を行に分割し、デスクトップの場合とまったく同じままであると期待しています。

martinffx 2018年09月15日

この問題を修正できますか？

celebritydeveloper 2019年11月17日

👍1

@celebritydeveloperこの動作は修正されました。デモを見てください：

milligram-mobile

cjpatoilo 2020年05月20日

@dnohr @martinffx今のところ、この問題をクローズします。
どうぞ、お気軽に再開するか、新しいものを開いてください。