http://css-bug.seesaa.net/ 自分がぶちあたったブラウザのバグとそれに対処した方法を記す備忘録万が一役に立ったらコメント残してくれるとうれすぃー。 ja http://blogs.law.harvard.edu/tech/rss 自分がぶちあたったブラウザのバグとそれに対処した方法を記す備忘録 万が一役に立ったらコメント残してくれるとうれすぃー。 ERROR: NOT PERMITED METHOD: nickname no http://css-bug.seesaa.net/article/103993426.html Fri, 01 Aug 2008 14:40:15 +0900 あああこういう枠をつくってmouseoverしたときに背景を変えたいとき、getelementbyid でやればいいんだけどcssでもできる。:hover の疑似セレクタを使えばいいけどIE6だと a タグ以外サポートしていない。どうするかというと以下のように a タグを block 要素として扱えばいい。<a href="URL" class="hoverLink">あああ</a>.hoverLink{display:block;padding:10... あああ
こういう枠をつくってmouseoverしたときに背景を変えたいとき、
getelementbyid でやればいいんだけどcssでもできる。

:hover　の疑似セレクタを使えばいいけどIE6だと a タグ以外
サポートしていない。どうするかというと以下のように a タグ
を block 要素として扱えばいい。

<a href="URL" class="hoverLink">あああ</a>
.hoverLink{
display:block;
padding:10px;
background:#ccc;
border:solid 1px #000;
}
.hoverLink:hover{
background:#fff;
}


例：
あああ
]]>オススメ・スポンサーサイト： サポート | class | display | solid | border ]]> 日記 ふなふな http://css-bug.seesaa.net/article/103568290.html Fri, 25 Jul 2008 14:11:53 +0900 なぜかie7のハックが効かなかったので、http://www.koikikukan.com/archives/2006/11/17-015033.phpぐぐったらIE6のアンダースコアハックの要領で以下の記号ならなんでもいけるそう。http://pico.g.hatena.ne.jp/vantguarde/20060701!@#$%^&*()+=/?.,|[]{;:&lt;&gt;便利なのでこれからも使おうと思ったけど、、う、うーん。どれにしよう。。 html ファイルではあ... http://www.koikikukan.com/archives/2006/11/17-015033.php

ぐぐったらIE6のアンダースコアハックの要領で以下の記号なら
なんでもいけるそう。
http://pico.g.hatena.ne.jp/vantguarde/20060701
!@#$%^&*()+=/?.,|[]{;:<>


便利なのでこれからも使おうと思ったけど、、う、うーん。
どれにしよう。。 html ファイルではあんまり見かけない
$　あたりが便利かなぁ。後々検索しやすくて。

ドルドレイハックと名付けよう。あぁ久しぶりにオラタンが
やりたい。ごめん、ドルドレイはウソ。



あ、ちなみに当然IE6にも効くので、最終的に以下のようになるかも。

padding:10px;
$padding:5px;/* IE7,IE6 用 */
_padding:0px;/* IE6 用 */

もっさいなーｗ



]]>オススメ・スポンサーサイト： ファイル | http | www | アンダー | archives ]]> 日記 ふなふな http://css-bug.seesaa.net/article/99459376.html Thu, 05 Jun 2008 11:54:29 +0900 ・横幅を決めていて、そこにぴっちり画像を並べている場合は ソース上の改行をとってみる・form のstyleをpadding:0;margin:0;にする・使っている画像に1px余計な隙間が入り込んでいないか確認する・h[1-4]タグを使っている場合はstyleをpadding:0;margin:0;font-size:12px;にするhタグを使ってその中に画像しかない状況って言うのはあんまり無いだろうしお勧めできないんだけどfont-size:12px;がないと本来のfon... ・横幅を決めていて、そこにぴっちり画像を並べている場合は
　ソース上の改行をとってみる
・form のstyleをpadding:0;margin:0;にする
・使っている画像に1px余計な隙間が入り込んでいないか確認する
・h[1-4]タグを使っている場合はstyleをpadding:0;margin:0;font-size:12px;にする

hタグを使ってその中に画像しかない状況って言うのはあんまり
無いだろうしお勧めできないんだけどfont-size:12px;がないと
本来のfont-size:18px;ぐらいのスペースが取られてしまうこと
を最近知りました。ちなみにIEだけ。


]]>オススメ・スポンサーサイト： style | font | size ]]> 日記 ふなふな http://match.seesaa.jp/ot_listing.pl?aid=63720&sid=css-bug&tid=seesaa_hotspot&k=%E5%85%B1%E7%94%A8%20%E3%82%B5%E3%83%BC%E3%83%90%E3%83%BC&hid=35 Thu, 05 Jun 2008 11:54:29 +0900 専用 レンタル サーバー | レンタル サーバー | 専用 サーバー | ドメイン 取得 | 独自 ドメイン ]]> ads by Seesaa http://css-bug.seesaa.net/article/92124570.html Thu, 03 Apr 2008 19:18:12 +0900 バグではないけどグダグダな話題でも書いてみようかと思ったけどあんまり思いつかないっていうグダグダっぷり。http://blog.so-net.ne.jp/のヘッダーの、ボタンっぽい部分にマウスをもっていくと画像が切り替わる。ようにみえる。手法は昔からよくつかわれているけどソースを見ると表示されないテキストが書いてあったりする。クローキングだと疑われないのかな。 けどあんまり思いつかないっていうグダグダっぷり。

http://blog.so-net.ne.jp/
のヘッダーの、ボタンっぽい部分にマウスをもっていくと
画像が切り替わる。ようにみえる。手法は昔からよくつかわ
れているけどソースを見ると表示されないテキストが書いて
あったりする。クローキングだと疑われないのかな。

]]>オススメ・スポンサーサイト： http | 話題 | net ]]> 日記 ふなふな http://css-bug.seesaa.net/article/91328896.html Fri, 28 Mar 2008 11:53:54 +0900 原因調査中のメモIEのメインを（間違ってもメインブラウザをIEにしたりはしない）7にして、6をスタンドアローンにしてから確認がおざなりになって久しい。そんな中でたまに6で確認すると表示が崩れている。・floatで組んだレイアウトがおかしい （ある画像の左側1pxが消えている）・backgroundの様子がおかしい （マウスでなぞると no-repeat なのに繰り返し気味の表示になる）なにか簡単なことをミスってるんだろうけど、IE6をメインに確認しているときはなかった表示崩れ... 原因調査中のメモ

IEのメインを（間違ってもメインブラウザをIEにしたりはしない）
7にして、6をスタンドアローンにしてから確認がおざなりになって
久しい。そんな中でたまに6で確認すると表示が崩れている。

・floatで組んだレイアウトがおかしい
　（ある画像の左側1pxが消えている）
・backgroundの様子がおかしい
　（マウスでなぞると no-repeat　なのに繰り返し気味の表示になる）

なにか簡単なことをミスってるんだろうけど、IE6をメインに確認
しているときはなかった表示崩れが二つも出て困惑中。じっとり
調べる時間をplz ]]>オススメ・スポンサーサイト： 調べる | レイアウト | ブラウザ | スタンド | アローン ]]> 日記 ふなふな http://match.seesaa.jp/ot_listing.pl?aid=63720&sid=css-bug&tid=seesaa_hotspot&k=%E3%82%A8%E3%82%A2%E3%82%B3%E3%83%B3&hid=35 Fri, 28 Mar 2008 11:53:54 +0900 業務用 エアコン | エアコン 取付 | エアコン クリーニング | ダイキン エアコン | ナショナル エアコン ]]> ads by Seesaa http://css-bug.seesaa.net/article/75328894.html Sat, 29 Dec 2007 17:35:30 +0900 position:absolute; を使ったボックス要素の子要素でwidth:300px; のようにサイズ指定してるにも関わらず枠幅を無視して内容がはみだしてしまう。・子要素の並列で最後に clear:both; する position:absolute; を使ったボックス要素の子要素で

width:300px; のようにサイズ指定してるにも関わらず
枠幅を無視して内容がはみだしてしまう。


・子要素の並列で最後に clear:both; する ]]>オススメ・スポンサーサイト： ボックス | absolute | clear ]]> 日記 ふなふな http://css-bug.seesaa.net/article/66572900.html Wed, 14 Nov 2007 23:41:42 +0900 参考http://anslasax.net/css-make/cascade.html但し、IEの場合 import 先のファイルで!importantがあっても、import 元のファイルで上書きの記述がある場合!importantより優先される。...裏づけはなし。誰か実験して。 参考
http://anslasax.net/css-make/cascade.html

但し、IEの場合 import 先のファイルで!importantがあっても、
import 元のファイルで上書きの記述がある場合!importantより
優先される。


...裏づけはなし。誰か実験して。 ]]>オススメ・スポンサーサイト： http | ファイル | make ]]> 日記 ふなふな http://css-bug.seesaa.net/article/66571577.html Wed, 14 Nov 2007 23:37:19 +0900 vertical-align:baseline;をつかう vertical-align:baseline;

をつかう ]]> 日記 ふなふな http://css-bug.seesaa.net/article/53157826.html Wed, 29 Aug 2007 17:22:02 +0900 最近全然バグのことじゃないけど。自分のおまぬけ備忘録。&lt;h3 class="title"&gt;タイトルよ&lt;/h3&gt;とかあって、あれースタイル効かないなと思ってたらこんなんなってました。h3 {padding:10px 0px 5px;margin:20px;}.title{padding:0;margin:0;}まぁ例が極端なのでアレですが、cssファイル内では上二つの記述が離れていたため小一時間悩むハメに。セレクタは上から順に読まれるので、「下にあるのが...

<h3 class="title">タイトルよ</h3>

とかあって、あれースタイル効かないなと思ってたらこんなん
なってました。

h3 {
padding:10px 0px 5px;
margin:20px;
}

.title{
padding:0;
margin:0;
}


まぁ例が極端なのでアレですが、cssファイル内では
上二つの記述が離れていたため小一時間悩むハメに。

セレクタは上から順に読まれるので、「下にあるのが優先」です。

]]>オススメ・スポンサーサイト： ファイル | class | title | タイトル | スタイル ]]> 日記 ふなふな http://css-bug.seesaa.net/article/53149200.html Wed, 29 Aug 2007 15:42:27 +0900 divで組んだtable風レイアウトのborderが下まで伸びない時、height:100%; とすればいいが親要素に height:200px; のようにサイズが入ってなければいけない。仕様。親要素の高さが場合によって違う場合は何も指定しなければheight:auto; で可変になるが、以下のような場合で、&lt;div style="float:left;border-right: solid 1px #000;"&gt;内容１&lt;/div&gt;&lt;div st...
height:100%; とすればいいが親要素に height:200px; の
ようにサイズが入ってなければいけない。仕様。

親要素の高さが場合によって違う場合は何も指定しなければ
height:auto;　で可変になるが、以下のような場合で、

<div style="float:left;border-right: solid 1px #000;">内容１</div>
<div style="float:left;">内容２</div>
<div style="clear:left;"></div>

内容１　と　内容２　の高さがわからない場合、どちらが
高いかによって線が途中できえてしまう。
正しくはないかもしれないけど　min-height:100px;　で一応解決

<div style="min-height:100px;float:left;border-right: solid 1px #000;">内容１</div>
<div style="float:left;">内容２</div>
<div style="clear:left;"></div>





]]>オススメ・スポンサーサイト： レイアウト | solid | style | table | clear | border ]]> 日記 ふなふな http://css-bug.seesaa.net/article/51408023.html Tue, 14 Aug 2007 22:16:30 +0900 ボックスの解釈がIEは間違ってるせい。・widthの指定がなければしてみる・各種hackを駆使してみる・そもそも横幅一杯になる必要があるborderを使わない・borderを背景画像にする ・widthの指定がなければしてみる
・各種hackを駆使してみる
・そもそも横幅一杯になる必要があるborderを使わない
・borderを背景画像にする
]]>オススメ・スポンサーサイト： ボックス | hack | border ]]> 日記 ふなふな http://css-bug.seesaa.net/article/50694277.html Wed, 08 Aug 2007 15:24:49 +0900 以下のようにするとき、どのタイミングでクリアするか。&lt;div&gt;&lt;div style="float:left;"&gt;左&lt;/div&gt;&lt;div style="float:right;"&gt;右&lt;/div&gt;&lt;div&gt;その下&lt;/div&gt;&lt;/div&gt;以下の形が一番問題がでづらい。&lt;div&gt;&lt;div style="float:left;"&gt;左&lt;/div&gt;&lt;di...
<div>
<div style="float:left;">左</div>
<div style="float:right;">右</div>
<div>その下</div>
</div>

以下の形が一番問題がでづらい。

<div>
<div style="float:left;">左</div>
<div style="float:right;">右</div>
<div style="clear:both;"></div>
<div>その下</div>
</div>
]]>オススメ・スポンサーサイト： style | clear ]]> 日記 ふなふな http://css-bug.seesaa.net/article/50693799.html Wed, 08 Aug 2007 15:19:54 +0900 ・これもIE6限定。アンダースコアハックを使うのが楽margin-left:10px;_margin-left:5px;
margin-left:10px;
_margin-left:5px;
]]>オススメ・スポンサーサイト： アンダー | 限定 ]]> 日記 ふなふな http://css-bug.seesaa.net/article/50693642.html Wed, 08 Aug 2007 15:18:37 +0900 ・hasLayoutのせい。*{zoom:1;}とする。・&lt;div style="clear:both;"&gt;&lt;/div&gt; してると無理・諸々調整が必要になったりインライン要素追加したりしないといけない・IEうんこ■参考http://coliss.com/articles/build-websites/operation/css/143.html ・<div style="clear:both;"></div> してると無理
・諸々調整が必要になったりインライン要素追加したりしないといけない
・IEうんこ

■参考
http://coliss.com/articles/build-websites/operation/css/143.html ]]>オススメ・スポンサーサイト： clear | style ]]> 日記 ふなふな http://css-bug.seesaa.net/article/50693489.html Wed, 08 Aug 2007 15:16:37 +0900 ・after擬似クラスとcntentプロパティを使う■参考http://blog.webcreativepark.net/2007/01/08-231453.html
■参考
http://blog.webcreativepark.net/2007/01/08-231453.html
]]>オススメ・スポンサーサイト： after ]]> 日記 ふなふな