bootstrap の横サイズを任意の固定幅にする

system — Mon, 08 Dec 2014 15:54:18 +0000

これがなかなかてこずりました。
.container を width:960px; などにするとモバイルなどのときのメディアクエリ毎に再設定しなければならないし面倒だなあ。。と思っていたら、公式サイトのExsampleのコードを見たら解決できました。

下記のように .container に max-widthを指定してやればモバイルなどの場合は bootstrap本体のcssがいきてうまくいきますね。分かれば簡単でしたが探索に時間がかかりました。。

@media (min-width: 768px)
.container {
	max-width: 730px;
}

＜参考＞
Narrow Jumbotron Template for Bootstrap

bootstrapの場合は迷ったら Example を見るのもいいかもしれませんね。
Bootstrap#examples

bootstrap sass 版をインストール

system — Mon, 08 Dec 2014 15:28:53 +0000

よなよなbootstrap を学ぼうかと思いました。lessはまだ良く分からないのでsass版を使いました。

Railsも使い方分からないので下記を参考に「非Rails環境でbootstrap-sassをインストールする場合」でインストールしました。
＜参考＞
Bootstrap 3 Sassの使い方

gem install bootstrap-sass　でエラーが出ましたが下記で対処できました。
＜参考＞
ERROR: Could not find a valid gem ‘gem名’ (>= 0), here is why: Unable to download data from https://rubygems.org/ と出た場合の対処法

中のscssがstyle.scss　という名前だったので bootstrap.scss にしたいと思いリネームしたら　「自らを読み込んでる」みたいなエラーが出たので style.scss に戻したらエラーはでなくなりました。 compass 内部で bootstrap.scssをなんだかんだしてるんでしょうか。結局 bootstrap-sass.scssにしました。

bootstrap のTipsなどは今後また追加していければ。。

webz3 » bootstrap

bootstrap の横サイズを任意の固定幅にする

bootstrap sass 版をインストール