<a href=””>ああああ</a> | <a href=””>ああああ</a></a>
</div>
.t_menu {
padding-left:10px;
width:790px;
height:24px;
color:#F8F7F5;
font-weight:bold;
background-image:url(”../common/c_title_top.gif”);
background-position:right bottom;
background-repeat:no-repeat;
}
t_menuに高さ24pxの背景画像を設定しています。ポジション指定あり。
このt_menuの中にテキストリンクを入れているのですが、
この時にテキストリンクの位置を下げたいのです。
この仕様で可能なのでしょうか?
不可能であれば可能な対処法をご教授くださいませ。
基本的なことかと思いますがよろしくお願い致します。
padding-left:10px;
を
padding:10px 0px 0px 10px;
とかにしたらどうでしょう?
URLはダミーです。
あれこれ試してみたのですが私の知識・経験では1つのclassにて対応が出来ませんでした。
CSSについてそんなに詳しいわけではないのでご希望に添えないかもしれませんが…
別途以下のCSSを追加して
.text_down {
vertical-align: -3px;
}
<font cless=”text_down”><a href=””>ああああ</a> | <a href=””>ああああ</a></font>
とすれば文字の位置が下がります。
下げる量は”-3px”の数値で調整することになります。
確かにできますが各ブラウザでの数値の間隔が違のでieを元に指定するかff,nnを元にするかでどちらかは諦めるしかないですね。
ありがとうございました。
他に方法はないものでしょうか。。。
http://cssbug.at.infoseek.co.jp/detail/winie/b069.html
Internet Explorer (Windows) CSSバグリスト
vertical-alignはクラス名などが対象では
うまく反映されないバグがあるようです。
(strictも互換モードも)
.t_menu{
width:790px;
height:24px;
padding:12px 0 0 10px;
color:#F8F7F5;
font-weight:bold;
vertical-align:bottom;
background:gainsboro url(xxxxx.gif) right bottom no-repeat;
}
つまり、有効な解決策がないので、
左上からpaddingで文字を押し込めた方がてっとり早そうですね。IEもFireFoxもまだまだ正しいCSSを反映しているとは言い難いようです。
ありがとうございます。
そうですね、ブラウザ毎の解釈が違うのはどうにかしてほしいです。
http://acacia.fc2web.com/hatena/
URLはダミーです。
<div class=”t_menu”>
<div class=”aaaa”>
<a href=””>ああああ</a>|<a href=””>ああああ</a>
</div>
</div>
.t_menu{
position:relative;
}
.aaaa{
position:absolute;
bottom:0;
}
このようなpositon指定で出来るかもしれません。
※div病注意
ご回答ありがとうございます。
そういうことではないですね。
説明足らずで申し訳ありません。
height:24pxのボックスのbottomにテキストを落としたいのです。(画像の一番下部分に合わせたい)画像のheightが24pxです。