Simplicityの特徴 › フォーラム › Simplicityについての質問 › メインコンテンツのグリッドシステムについて
- このトピックには4件の返信、2人の参加者があり、最後ににより1年、 11ヶ月前に更新されました。
-
投稿者投稿
-
-
マルコメゲスト
お世話になります。
初心者です。これまでbootstrapでサイト運営をしていたのですが
Simplicityをテーマに奮闘中です。
メインコンテンツの中を所々
2カラム、3カラムにしたいのですがcssやhtmlをどのように記述すればよいのでしょうか?
ご指導宜しくお願いします。
-
Hidekichiゲスト
>メインコンテンツの中を所々
例えばどのあたりでしょうか?
サンプルとしては こんな感じ | codepen です。
css部分はscssで書いてるので、もしコピペで利用される場合はview compiledでcssにしてから利用して下さい。他にもfloat使ったり色々できますが、今時はflexです。方法は色々あります。
後はどの箇所で、何列必要か、どの要素かによりますが、中身が潰れていっても良いのであれば何列でもイケます。基本flexは、中身が溢れるようになると自動で改行します。横並びの中に縦並びも作れます。
-
わいひらキーマスター
Simplicityには、Bootstrapのようにフレームワーク的にクラスを追加して、グリッドを設定できるという機能はないです。
設定するには、hidekichiさんの書かれているように、自前で実装するしかないかもしれません。
あとは、Bootstrapのグリッド部分のみを読み込んで使うとか。ただ、これだとCSSが衝突する可能性もなくはないです。 -
マルコメゲスト
ありがとうございました。
「flex」ちょっと頑張って調べてみます。 -
Hidekichiゲスト
flexの良い所は、@media screenも一応(スマホで横100%表示にする際に)必要なんですが、基本は自動でレスポンシブになる所です。
問題点は、ベンダープレフィックスが必要な所ですかね。codepenで書く時はscssを利用していますが、ローカルにgulpとか、その他諸々のタスクランナー等の環境が作れるのであれば、ベンダープレフィックスは自動で付けられますし、そういう環境がない場合でもATOMやBracketsあたりの今どきのエディターならプラグインでつけれたりもします。
can i useなどから最新の情報を読み取り、必要なプレフィックスを付けてくれたりするものもあります。
そういや、Bootstrap4でしたっけ?最近リリースするぜって言ってたのって。あれ、sassとflexなるんですってね、奥さん。いや、正確に見てないので確定した情報ではないんですけど、そんなことが書いていたような気がします。
ようやく世間がsassとflexに追いついたって感じでしょうか。
まぁ、遅ぇーよって感じなんですけどね(笑)
-
-
投稿者投稿