予想される発生条件 「autocomplete-paths ver 1.0.2」が有効 HTMLモードになっている（Plain Textモードでは発生しませんでした。） 上記の条件下でURLを編集した際に発生しました。 「autocomplete-paths ver 1.0.2」を無効化した状態ではフリーズせず。 …
しかもブラウザ上で動作するなんて・・・ CodePenがこんなに便利なんて知りませんでした(´ｪ`) 今までWEBプログラミング系のブログで何度か埋め込みを見たことはありましたが、実際に使ってみると使いやすいのなんのって！ しかもemmetが使える 半信半疑で ! …
ページ内でのリンクを貼る場合 <a href="#pagetop">ページトップへ戻る</a> などと書きますよね。Q&Aのページなどの場合大変便利。 でもこれ、普通にリンクを貼るだけだと瞬間的に画面が切り替わってスクロールされている感が少ない！ ちょっとこだわったサイトだとすーーっとスクロ…
今日のお題は「きっちり」三等分できる書き方。 どんな書き方を想像しましたか？ この書き方を知るまで僕は .col3 li { width : 33.33333% ; } のような書き方をしていました。 実際にこの書き方をしているウェブサイトもよく見かけます。 が、性格の問題も…
見出しの背景画像として、幅1pxの画像をリピート表示させようとしたところAndroid標準ブラウザでのみ機能しなかったお話。 Android標準ブラウザで背景画像が表示されない ChromeやSafariでは正常に表示されたがAndroid標準ブラウザのみ背景が表示されなかっ…
楽天 スマホ商品ページ共通説明文の画像CSSが書き換えられていた 商品ページ共通説明文の画像に対して厄介なCSSが記述されていました。 gista516c703c5d264491359 共通説明文内の画像すべてにblock表示横幅最大100％余白0が、!importantで強制的に適用される…
Google Developers「PageSpeed Insights」を使えば自分のサイトの出来栄えというか改善すべき点をすべて洗い出してくれます。 100点満点中・・・61点！ のように直感的にスコアが表示されるので分かりやすい！ ちなみにこのブログCODE-LIFEはスコア61でした…
仕事でWEB制作している時に使ったもののメモ書きです。 年々回線速度はアップしているが、画像が多いページの場合は完全にページを表示するまでに時間がかかってしまうもの。 読み込んでいる間に右画像のようなローディング画面を表示する方法のうちなるべく…
インラインフレームを使用する場合はフレーム内のリンクにtargetをつけなければ、フレーム内部でページが開かれてしまう。 これを回避するために使われるのが 上記を<head>内に記述すればリンクのtargetが全て親ウィンドウで開かれるようになる。 しかし、この<base>タグ</base></head>…
今年の4月からWEB製作の仕事を始めたが、やはり初めてやる仕事でつまずくことが多々ある。 もともと趣味でWEBサイトの運営をいくつかやっていたことが強みと自負していたが、あらためて仕事としてやっていくうちにCSS・JavaScriptなどのコーディングの奥深さ…
