-1
私はテキストフィールドとボタンだけがあるフォームを持っています。彼らは同じ行にあり、最初にtexttfieldが来て、次に右のボタンが来ます。つまり、ボタンはキャプションに基づいて展開され、テキストフィールドは残りの部分を埋める必要があります。 、ボタンは右のそれは私が欲しいものである右側、上に配置されているページに=によるフロートに最初の項目ですが、マークアップこれでフォーム項目poittinging問題
<html>
<head>
<style>
#search_form {
width:500px;
}
#search_button_container {
float: right;
}
#search_field_container {
overflow: hidden;
}
#search_field {
width:92%;
}
</style>
</head>
<body>
<form id="search_form">
<div>
<div id="search_button_container">
<input type="submit" value="Search" id="search_submit" />
</div>
<div id="search_field_container">
<input id="search_field" name="search_field" type="search" />
</div>
</div>
</form>
</body>
</html>
：これを実現するために、私はこのようなものを使用しましたしかし、これはtabindexの順序を乱します。 Tabキーを押すと、最初にボタンがフォーカスされ、次にテキストフィールドが表示されますが、テキストフィールドを最初にする必要があります。
注：この検索フォームの上および上に他の要素があり、tabindexが上から下に移動する必要があるため、tabindex = 1をtextfieldおよびtabindex = 2に追加できません。
tabindexの並べ替えや並べ替えの方法に要素を配置する別の方法はありますか？私の場合、最良の解決策は、望ましい結果を得るために別のスタイルを使うことですが、どうやってそれをどうやって解決するのか分かりません。
恐らく私は自分自身をはっきりと説明していないでしょう。フォームの右側の枠の近くにあるボタンを右側に置き、テキストフィールドは残りのスペースを左側に埋める必要があります。私が掲示したコードをコピーして、ボタンのキャプションに長いテキストを置くことができます（値の属性を変更してください）。 – Hayk
私は、あなたが望むものではないにもかかわらず、固定幅のボタンを作成したいと思います。申し訳ありませんが、私はここに答えがありません。私が言うことは、 'overflow：hidden; 'でテキスト入力の部分を隠すことは悪い考えだと思います。また、' tabindex'を使わずに正しいタブ順序を作る唯一の方法は、最初に入力を文書に置きます。 –
どうもありがとうございました。 – Hayk