IEを使っているのですがこのボックスをきれいに並べる事はできないのでしょうか？何か良い案はありますか？になっています。今は若干ずれてしまいます。ファイアフォックスやオペラでも若干ずれます。 1個1個テーブルの中に入れるしかないでしょうか？

input　きれいに並べたい

解決済

質問者：XDSVXOKWNUUA
質問日時：2013/04/14 13:49
回答数：1件

IEを使っているのですが
このボックスをきれいに並べる事はできないのでしょうか？
何か良い案はありますか？

<input type="button" value="あ行"
onClick="location='#あ行'"/>
になっています。

今は若干ずれてしまいます。
ファイアフォックスやオペラでも若干ずれます。
1個1個テーブルの中に入れるしかないでしょうか？

通報する

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

質問の本文を隠す

回答 (1件)

No.1ベストアンサー

回答者： ORUKA1951
回答日時：2013/04/14 15:35

　ソースを見る限り、単なるページないリンクのようにしか見えませんが？

なら、ちゃんと<a href="#A">とすべきです。
　　（リンク先にする場合は使用できる文字に制限があります。IDと同じ名前空間を持ちます）
　inputを使うべきではありません。javascriptが無効なユーザーや、検索エンジンにはリンクの情報が伝わりません。

　それが、ずれるのは、プロポーショナルフォントだからです。
　しかし、リンクで記述し、スタイルシートでデザインすれば幅を指定できますから問題ないはずです。

★Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html# )
　のDATAタブで検証済みShift_JISのHTML4.01strictです。
★デザインはスタイルシートに任せてあるので、先で自由にデザインの変更が可能です。
　ボタンだろうが、ドロップダウンメニューだろうが・・ご随意に
★タブは＿に置換してあるので戻すこと。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
＿<title>サンプル</title>
＿<meta name="author" content="ORUKA1951">
＿<meta http-equiv="Content-Style-Type" content="text/css">
＿<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" >
＿<link rel="START" href="../index.html">
＿<style type="text/css">

＿</style>
</head>
<body>
＿<div class="header">
＿＿<h1>タイトル</h1>
＿＿<ol id="INDEX">
＿＿＿<li><a href="#A">あ行</a>
＿＿＿＿<ol>
＿＿＿＿＿<li><a href="#I">い</a></li>
＿＿＿＿＿<li><a href="#U">う</a></li>
＿＿＿＿＿<li><a href="#E">え</a></li>
＿＿＿＿＿<li><a href="#O">お</a></li>
＿＿＿＿</ol>
＿＿＿</li>
＿＿＿<li><a href="#K">か行</a>
＿＿＿＿<ol>
＿＿＿＿＿<li><a href="#KI">き</a></li>
＿＿＿＿＿<li><a href="#KU">く</a></li>
＿＿＿＿＿<li><a href="#KE">け</a></li>
＿＿＿＿＿<li><a href="#KO">こ</a></li>
＿＿＿＿</ol>
＿＿＿</li>
＿＿＿<li><a href="#S">さ行</a>
＿＿＿＿<ol>
＿＿＿＿＿<li><a href="#SI">し</a></li>
＿＿＿＿＿<li><a href="#SU">す</a></li>
＿＿＿＿＿<li><a href="#SE">せ</a></li>
＿＿＿＿＿<li><a href="#SO">そ</a></li>
＿＿＿＿</ol>
＿＿＿</li>
＿＿</ol>
＿</div>
＿<div class="section">
＿＿<h2>見出し</h2>
＿＿<div class="section" ID="A">
＿＿＿<div class="section">
＿＿＿＿<h3>あ</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="I">
＿＿＿＿<h3>い</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="U">
＿＿＿＿<h3>う</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="E">
＿＿＿＿<h3>え</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="O">
＿＿＿＿<h3>お</h3>
＿＿＿</div>
＿＿</div>
＿＿<div class="section" id="K">
＿＿＿<div class="section">
＿＿＿＿<h3>か</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="KI">
＿＿＿＿<h3>き</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="KU">
＿＿＿＿<h3>く</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="KE">
＿＿＿＿<h3>け</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="KO">
＿＿＿＿<h3>こ</h3>
＿＿＿</div>
＿＿</div>
＿＿<div class="section" id="S">
＿＿＿<div class="section">
＿＿＿＿<h3>さ</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="SI">
＿＿＿＿<h3>し</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="SU">
＿＿＿＿<h3>す</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="SE">
＿＿＿＿<h3>せ</h3>
＿＿＿</div>
＿＿＿<div class="section" ID="SO">
＿＿＿＿<h3>そ</h3>
＿＿＿</div>
＿＿</div>
＿</div>
＿<div class="footer">
＿＿<h2>文書情報</h2>
＿＿<dl class="documentHistry">
＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt>
＿＿＿<dd>2012-08-10</dd>
＿＿＿<dt id="LAST-MODIFIED">Last Modified</dt>
＿＿＿<dd>2012-08-10 12:00:00 (JST)</dd>
＿＿</dl>
＿＿<address>© ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address>
＿</div>
</body>
</html>