

【CSS】FlexboxとPositon:Fixedを使って要素を中央固定表示する方法
開発bootstrap,css2018.8.23(2018.8.27)
CSSである要素を中央に固定して表示するには、表示したい要素の高さ分をtopから差し引く、という方法が良く用いられます。 しかし、これは要素の高さを予め決定しておく必要があります。 もし高さが可変する場合はjQueryを…
CSSである要素を中央に固定して表示するには、表示したい要素の高さ分をtopから差し引く、という方法が良く用いられます。 しかし、これは要素の高さを予め決定しておく必要があります。 もし高さが可変する場合はjQueryを…
bootstrap等のボタンの色をインラインスタイルで指定しようとした場合、ホバー時(:hover)の色指定は出来ません。 数個であれば直接CSSを更新すれば良いのですが、数が多いと面倒です。 そのような際は、 <…
aタグの中にFont Awesomeのアイコンフォントと文字列を入れると、標準状態で、こんな感じになります。 でも、見た目としてはやっぱりアイコンの下に下線が入るのは不格好。 で、そういうときは、 .fa:before{…
CSSのcontentプロパティはこれまで、beforeやafter等の疑似要素を扱う際に .box:before{ content: ''; position: absolute; top: 5px…
CSScombは、予め設定したルールに従ってスタイルシートを整形・プロパティ毎にソートしてくれるツールです。 http://csscomb.com/ 例えば .style{margin-left:0px; backgro…
幅広くてデザイン的にちょっと頂けないブラウザのスクロールバー。 これをカスタマイズするにはjQueryのプラグインjQuery custom content scrollerをよく使うのですが、 http://manos…
https://techblog.livingsocial.com/blog/2015/04/06/responsive-tables-in-pure-css/ ウィンドウサイズを縮小すると行ごとに1つのカラムにまとめて…
メモ: 特定のエリア内でマウススクロールを停止したいのだけど(埋め込んだGoogle Map上でスクロールした際に、ページスクロールせずにGoogle Mapのズームのみ有効になる)、下記のようにしてもうまくいったりいか…
Foundationフレームワークがver.5になって実装されたOff Canvas機能を使いたいな、と思いまして、何気なく.jsと.cssを置き換えました。 (cssもver.4ではボタンのデザインが少々野暮ったい感じ…