最初のボタンと最後の要素にのみ丸い境界線を持つボタンのグループがあります。中間のボタンには何も含めないでください。これはうまくいきます。
ここで、同じことを行うテキスト フィールドを追加したいと思います。それが最初または最後である場合は丸い境界線を持つ必要があります。それ以外の場合はありません。
INPUT
テキスト フィールドとBUTTON
ボタンにを使用してい:last-child
ます。
:last-of-type
種類が違うので使えません。:last-child
他の兄弟 (ドロップダウン メニューなど) がある可能性があるため、機能しません。私のマークアップはそのままで十分に長いので、これ以上クラスを割り当てたくないのです。
私の現在:
BUTTON:last-of-type,
INPUT:last-of-type {
/* Corners */
}
私が欲しいもの:
BUTTON:last-of(BUTTON, INPUT),
INPUT:last-of(BUTTON, INPUT) {
/* Corners */
}
マークアップの例:
<div class="group">
<label>Controls:</label>
<input type="text" />
<button type="button">Search</button>
</div>
方法はありますか、または代替手段を探す必要がありますか?