HTML メッセージ ダイアログを実装しています。
受信者入力パネルが上に表示されています。多数の受信者と、オートコンプリート メニューを使用して新しい受信者を追加するためのテキスト ボックス (非表示になります) が最後にあります。
現時点では、インラインで表示される順序付けられていないリストとして実装しました。
<ul class="recipients inline clearfix">
<li class="recipient"><span>recipient 1<a href="#" class="remove">x</a></span></li>
<li class="recipient"><span>recipient 2<a href="#" class="remove">x</a></span></li>
<li class="recipient last"><span>recipient 3<a href="#" class="remove">x</a></span></li>
<li class="searchbox"><input type="text" class="search-recipient"></li>
</ul>
ul.inline li {
display: inline;
list-style-type: none;
}
問題は、受信者が複数の行にまたがると、テキストボックスが上に移動して利用可能なスペースを埋めることです:
テキストボックスが常に受信者の後に表示されるようにするにはどうすればよいですか?