”TOP”のリンクを”タイトル”と同じ行の右端にしたいのですが旧Internet Explorerだけ１行下がります。同じ行にしたいのですが。どうすればよいでしょうか？ --------------------------------- 上の例、タイトル TOP 説明文説明文説明文、、、 --------------------------------- 下の例、タイトル TOP 説明文説明文説明文、、、 --------------------------------- 上の例にしたいけど、下の例になってしまう、、、タイトル TOP 説明文説明文説明文、、、上記のdtとddは例なので１つですが連続で複数設定しています。 dt内はインラインしかできないようなのでＰやブロックにしないでフロートさせました。タイトルとTOPを逆にしたら可能ですが流れがなんか変ですし、、、ハックもできれば使いたくないのですが、どうでしょう？調べたり色々やったのですがわかりません＿/￣|○

もう少し詳しい情報が必要。それは文書構造上どこに位置するのか？何の定義リストなのか？

単語の右寄せ配置で１行下がる

解決済

質問者：takumana20
質問日時：2010/04/17 06:22
回答数：4件

”TOP”のリンクを”タイトル”と
同じ行の右端にしたいのですが
旧Internet Explorerだけ１行下がります。
同じ行にしたいのですが。どうすればよいでしょうか？

---------------------------------
上の例、タイトル　　　　　　　TOP
　説明文説明文説明文、、、
---------------------------------
下の例、タイトル
　　　　　　　　　　　　　　　TOP
　説明文説明文説明文、、、
---------------------------------
上の例にしたいけど、下の例になってしまう、、、

<dl>
<dt>タイトル　<a href="#" style="float:right;">TOP</a></dt>
<dd>説明文説明文説明文、、、</dd>
</dl>

上記のdtとddは例なので１つですが連続で複数設定しています。
dt内はインラインしかできないようなのでＰやブロックにしないでフロートさせました。
タイトルとTOPを逆にしたら可能ですが流れがなんか変ですし、、、
ハックもできれば使いたくないのですが、どうでしょう？
調べたり色々やったのですがわかりません＿/￣|○

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

ベストアンサー優先
最新から表示
回答順に表示

No.4ベストアンサー

回答者： salonpath
回答日時：2010/04/17 15:13

あーじゃあpositionはどうだろ

dt{
position:relative;
}
dt a{
position:absolute;
top:0;
right:0;
}

- 0
- 件

通報する

この回答へのお礼

揃いました。ありがとうございます。
実はpositionはバグとか不具合が難しそうなので避けていたのです。
今回も上からの位置を合わせるのに50％を使ったのですが、
やっぱり全然違う位置に表示されてしまって ^_^;
位置の％が原因とわかるまでに、しばらく悩み諦めかけました。
％は旧IEでだめなんですね。この事はemに変更して解決しました。

ここまで作るのにかなり順調に出来ていたのに、この質問のリンクの位置問題でかなりの時間を使ってしまいました・・・＿/￣|○

とりあえず、ハックを使わない方向でNO.3のzeffさんのフロートか
NO.4のsalonpathさんのpositionで色々テストしてみます。<(_ _)>

通報する

お礼日時：2010/04/17 18:52

No.3

回答者： zeff#1
回答日時：2010/04/17 11:38

タイトルをspanで括って左にfloatさせてみました。

IE6で動作確認済み。
当然ですがdtのwidth調整が必要です。

<dl>
<dt style="width:200px;"><span style="float:left;">タイトル</span><a style="float:right;" href="#">TOP</a></dt>
<dd style="clear:both;">説明文説明文説明文、、、</dd>
</dl>

この回答への補足

<dl>
<dt><a href="#" style="float:right;">TOP</a>タイトル</dt>
<dd>説明文説明文説明文、、、</dd>
</dl>

最初にアンカーを前にして、タイトルを後ろ入れ替えればば、たぶん見た目は揃うのですけど、意味が違うような気がするんです。どうでしょうか？

補足日時：2010/04/17 17:33

通報する

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。やっぱり、分けないとできないですよね。
もっと簡単にできると思ってたのですが難しいですね。

通報する

お礼日時：2010/04/17 16:52

No.2

回答者： ORUKA1951
回答日時：2010/04/17 10:35

もう少し詳しい情報が必要。

それは文書構造上どこに位置するのか？
<body>
　<dl>
　　<dt>
　　<dd>
何の定義リストなのか？

この回答への補足

<body>
<div>
<div>
<h1></h1>
<p></p><p></p>
</div>
<div>
<h2></h2>
<ul>
<li></li><li></li><li></li><li></li><li></li>
</ul>
<h3></h3>
<dl>
<dt>タイトル　<a href="#" style="float:right;">TOP</a></dt>
<dd>説明文説明文説明文、、、</dd>
<dt>タイトル　<a href="#" style="float:right;">TOP</a></dt>
<dd>説明文説明文説明文、、、</dd>
<dt>タイトル　<a href="#" style="float:right;">TOP</a></dt>
<dd>説明文説明文説明文、、、</dd>
</dl>
</div>
</div>
---------------------------------
Ｑ＆Ａです。
HTML上部の<ul><li>に各質問項目がありまして、
<li>の質問項目をクリックすると、<dt>に移動します。
その下の<dd>で説明します。

縦長になるので、TOPへ戻るのリンクを右側に置いて、行ったり来たり便利にしたいのです。でも、このTOPのせいで隙間を作りたくないのです。