2007/05/25

[技術系]   margin-left: -10000emとかのかわり

at 04:41JST
 
最近動向を見ていないので、世の「XHTML, CSS原理主義者(=W3C原理主義者)」がどんなくだらないテーゼを打ち出しているのか知らないのだけれど。

例の
「テキストを消すためにmargin-left: -10000emってするんだよ!
 プギャー!」Hack(笑、とあえてつける)
って、あんなことしなくてもこれでいいんじゃないかと思うのだが、何がいけないんだろう。

20070525cssmage3.png


ちゃんとツールチップも出るしなあ…。
まあ、それでもぼくは
「はじめっから画像を読み込むようにHTML書けばええやん」派
なのだが。

オレオレHTML規格準拠によるコーディング:
<style> 
#navigation li {
list-style: none;
}
#navigation .altTexts {
display: none;
}
a.naviSelections {
display: block;
width: 64px;
height: 64px;
border: 2px solid #ccccff;
}
a:hover.naviSelections {
border: 2px solid #666666;
}
a#naviToppage {
background: url( http://images-jp.amazon.com/images/P/B000QEVTSW.09.MZZZZZZZ.jpg );
}
a#naviNews {
background: url( http://images-jp.amazon.com/images/P/B000NUPCAA.09.MZZZZZZZ.jpg );
}
</style>
<p>
<a
href="/"
>test</a>
</p>

<ul
id="navigation"
>
<li>
<a
href="http://www.amazon.co.jp/exec/obidos/ASIN/B000QEVTSW/hirosiki-22"
class="naviSelections"
id="naviToppage"
title="トップページ"
>
<span
class="altTexts"
>トップページ</span>
</a>
</li>

<li>
<a
href="http://www.amazon.co.jp/exec/obidos/ASIN/B000NUPCAA/hirosiki-22"
class="naviSelections"
id="naviNews"
title="おしらせ"
>
<span
class="altTexts"
>おしらせ</span>
</a>
</li>
</ul>





画像は適切なのがなかったのでAmazonから借りました。セレクトに他意はありません。Fateってなに?

※追記
display: none;
だとFirefoxが該当ブロックをまるごと消してしまうので、
visibility: hidden;
か。



関連しそうな過去記事:
さらに過去の記事
2009/04 (1)   2008/12 (3)   2008/11 (9)   2008/10 (10)   2008/09 (20)   2008/08 (2)   2008/07 (23)   2008/06 (16)   2008/05 (22)   2008/04 (11)   2008/03 (21)   2008/02 (20)   2008/01 (21)   2007/12 (32)   2007/11 (37)   2007/10 (46)   2007/09 (63)   2007/08 (33)   2007/07 (41)   2007/06 (81)   2007/05 (173)   2007/04 (168)   2007/03 (113)   2007/02 (123)   2007/01 (92)   2006/12 (111)   2006/11 (185)   2006/10 (20)  
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。