CSS Trick or TreatというハロウィンパーティをしながらCSSの話をする会に参加してきました。 当日はお菓子を持っていくか、CSSのトリックを持っていかないと変態的なことしちゃうぞ♡というハロウィンパーティです。 当日のTwi[…]
タグ: CSS
PostCSSには変数が使えるようになるプラグインがいくつかあるので比較してみました。 PostCSSの導入記事はこちら PostCSSを導入してみた & PostCSSの便利プラグインと誰得プラグイン gulpでPostCSSま[…]
PostCSSにはネストが使えるようになるプラグインがいくつかあるので比較してみました。 PostCSSの導入記事はこちら PostCSSを導入してみた & PostCSSの便利プラグインと誰得プラグイン gulpでPostCSS[…]
flexbox便利ですが、新しいプロパティなためちょいちょい詰まることがあってツラいことも…。 display: flex使ってる要素にはテキストの折り返しが効かないことがあったのでメモ。 結論から言うと、flexboxやめるか[…]
CSSで簡単な矢印アイコンを作る小ネタです。 完成系はこちら See the Pen gwryVj on CodePen. CSSのコードはこちら セレクタは自由にしてください。 指定したい[…]
PostCSSを初めて聞いたのはちょうど1年前ぐらいの勉強会で。その時はSassも勉強始めたばかりというのもあり、こんなのあるのか程度で終わってました。 でも、最近PostCSSを使う機会があったり、Sass以外の何か触ってみたいなというの[…]
مرحبا هناك كيف حالك ؟ ؟ 先日、Webサイトのアラビア語対応というものをしたので覚え書き。 今後アラビア語サイト対応するか分かりませんが、いつか石油王あたりから制作案件が舞い込んでくるかもしれないので覚えておいてもよさ[…]
スタイルガイドは全く使ったことがありませんでしたが、ちょっと使う機会があったので試してみました。 調べてみると、Node製のstyledoccoやRuby製のhologramなどがあるそうですが、たまたまSNSでシェアされていたNode製の[…]
今や定番のドロワーメニューやモーダルメニュー。 実装しているサイトは多いのではないでしょうか ただ、こういったメニューを取り入れているサイトで気になるのが、 メニューを開いている間、メニュー以外のコンテンツがスクロールしてしまう状態。 特に[…]
日に開催された関西フロントエンドUGの「WebデザインとUX について考える」に参加してきました。 UXはよく分かっていないので、すごく楽しみにしていました。 セッション内容 おっぱいから見るUI/UXとPELSONA イ[…]
よく使うわけではないけど、便利なCSSセレクタを随時更新で追加していきます。 pointer-events pointer-eventsをnoneにすればドラッグやホバー、クリックイベントが効かなくなります。 会員制のサイトなどでユーザーに[…]
日に開催された関西フロントエンドUGの「Webとアニメーションの様々なありかた」に参加してきました。 本日は会場TAMさんをお借りして、「Webとアニメーションの様々なありかた」です! https://t.co/YIzYA[…]
スマホアプリのコーディングをしていた時、 設定画面であるようなON/OFFのチェックボックスをCSSで作った時のサンプルと、 その際iOSで発生したバグの対処法まとめです。 目次 inputタグとlabelタグとの関連付け CSSで作ってみ[…]
12月5日に開発合宿とやらに初めて参加してきました。 今更ながらレポート 謝辞 当日撮った写真データ消してしまいました(笑) 尾崎の家 「尾崎の家」というところで合宿をやりました。 南海電車の尾崎駅から徒歩30分ほど。 ちょっと遠いのでタク[…]
D2Dのアクセシビリティ勉強会「オマケ会 D2D アクセシビリティ勉強会 ~アクセシブルなCSSもやっとこう~」に参加しました。 年間通しアクセシビリティについて勉強し、最後はみんなで勉強しつつアクセシブルなサイトを制作していました。 前回[…]
画像をある範囲内の左右中央、上下左右中央に配置させたいことはよくあると思います。 また、画像はクライアントが入れるからどんなサイズの画像が入るか分からないけど、 画像の中心がエリアの中央に配置されるようにしたいなど。 画像の配置に関する記述[…]