::-webkit-slider-thumb が効かない時の確認事項
input type=”range” のデザイン変更で こう書いたら理由は不明だが効かず… このように書き分けるといけた/ なぞ…
safari flex box での画像アスペクト比問題の対処
返信
flex boxのこ要素にimgがある場合、safariだと縦にびよーんと伸びてしまったりすることがある。 原因は flex の align-items のデフォルトが stretch なためで、縦にストレッチしちゃう。 …
カテゴリー: html + css
青いブラーをkill
safariのinputなどででる青いブラー、うざい時多いですよね。 毎度あれどうするんだっけとググるのでググらないで済むようにメモ。 あれはoutlineプロパティによって出現しているので、一括で殺すのであれば「*」で … 続きを読む
任意の複数行ではみ出る文字数の場合「…」で処理する
一行の場合は だけど複数行の場合はちょっと手間 ブラウザ互換状況：https://caniuse.com/?search=line-clamp あー旅がしたい
WebP画像でスピード改善
フロントエンドにおいてスピード改善はいつまでも付き合う必要のある課題ですが、世の中の進歩が早過ぎでもはやおっさんには追いつけないレベル… 日々泣きながら色々いじり倒していますが、CDNサービスを利用せず自前の … 続きを読む
HTML/CSS/JS コーディングお役立ち系
コーディングの際に多用するお役立ち系リンク。 CSSプロパティ互換性の確認：https://caniuse.com/ ▼素材関連 ・画像サイズ圧縮 https://tinypng.com/ 落とせるときは以下くらい圧縮で … 続きを読む
指定した要素の内容一致で処理する（完全一致、部分一致それぞれ）
世の中気づけばjQueryオワコンだぜみたいな風潮あり、自分もプロジェクトによってはそんなフリして取り組んでいますがちょっとした実装にはいまだ便利ですよね。 jQueryオワコン派の方に刺されないよう静かに生きていきたい … 続きを読む
cssで文字のアンチエイリアス調整
webkit系 Fifox 個人的な感触としてはRetinaディスプレイかどうかなど環境や、使っているウェブフォント、ウェイトなどによって大分違うので、普段より広範囲でのプレビューが必要かもしれないというのがある。 けど … 続きを読
CSSでテキストを強制的に小文字、大文字に変更する
頻度は低いからすぐ忘れるけど、便利。
getMonth()の英語表記対応
getMonth()の英語表記対応 英語表記を配列に入れて置き換える。 getMonth()、数字表記のときは+1する（0からはじまるから） 引用元：http://mkasumi.com/memo/entry-793.h … 続きを読む