「ブログが作りたい!」はブログの作り方をご紹介する入門サイトです。FC2ブログ、ブログのカスタマイズ、Google Analytics、SEO、GIMPなどの情報をご紹介しています。
同じスタイルを指定しているのにブラウザによって表示が異なるなどのバグ・トラブルについて解説します。 グローバルナビゲーション webサイト(ホームページ)作成基礎 HTML・CSS基礎 ステップアップ & 小技 素材・テンプレートなど 資料 CSSバグとは何か CSSバグは、ブラウザによるCSSの独自の解釈により、作成者の思ったとおりではない、あるいは他のブラウザと異なる表示のされ方をしてしまう現象を指します。 CSSバグの回避法・初歩の初歩 CSS作成中の表示確認はSafari・Opera・Firefoxなどで行う 残念ながら、ユーザーが多いInternet Explorerにはたくさんのバグが存在します。より多くのブラウザでできるだけ思い通りのデザインを実現したい場合は、上記のようなCSSを極力正しく解釈するブラウザに合わせてCSSを書き、その後IE向けに調整する方が効率的です(参考:
長い半角英数字が改行されず思いのほかレイアウトが崩れることってありますよね。 特に掲示板みたいなユーザに入力してもらうようなシステムの場合 開発時に想定してなかった長い半角英数字なんかをいれられて、 後から「おおおなんじゃこりゃぁああああ」なんてことがたまにあります。 ただ、最近までレイアウトが多少崩れても「まぁいっか」くらいの気持ちでして(←だめだね) どうしても解決しなければいけないときは、textarea を強引に流用したり誤魔化してきたような。。。。とはいえ、そんなずぼらなことではいけない気もするのでjQueryのプラグインを作ってみました。 IE系のCSSには、独自に拡張した word-break: break-all; を使えばすぐに解決できるのですがそれ以外のブラウザがまだ対応してないみたいでここがちょっとネックですね。 CSS3くらいには標準になるのかな? いろいろ、調べて
最近やたらとURLなどの文字列が折り返されない現象で頭を悩まされます。IEとSafari3以降はCSSでword-break:break-allを指定すれば折り返してくれます。Firefox3はハイフン(-)やスラッシュ(/)があればそこで折り返すのですが、半角英数のみだと折り返してくれません。word-break:break-allと少し挙動が違うようです。Firefox2はハイフン等の記号があっても折り返さず、突き抜けてしまします。 to-RさんがFirefoxとOperaでword-break:break-allを実現する「wordBreak.js」を公開していますが、tableだけにしか適用されずFirefox2をサポートしていないので、自分で書いてみました。(追記:ソースをgistにあげました) wordbreak.js for jQuery — Gist IEとFirefox2
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く