如何使textbox填补html中其他两个控件之间的空白

我有单选按钮列表，然后是一个文本框，然后是一个按钮

这些应该是同一条线

收音机位于最左侧，按钮位于最右侧，文本框用于填充收音机之间的间隙

我构建了这段代码，但没有得到正确的结果

            <div style="background-color: yellow; display: inline-block;">
                <asp:RadioButtonList ID="rdxCoding" runat="server" RepeatDirection="Horizontal">
                    <asp:ListItem Selected="True">Text</asp:ListItem>
                    <asp:ListItem>Font</asp:ListItem>
                    <asp:ListItem>Colour</asp:ListItem>
                    <asp:ListItem>Number</asp:ListItem>
                </asp:RadioButtonList>
            </div>
            <div style="background-color: aqua; display: inline-block">
                <asp:TextBox runat="server" ID="txtRepText" Placeholder="Search Text" Width="100%"></asp:TextBox>
            </div>
            <div style="background-color: fuchsia; display: inline-block">
                <asp:Button ID="btnRepSearch" runat="server" Text="Search" OnClick="btnRepSearch_Click" Font-Names="Courier New" />
            </div>

文本
字体
颜色
数字

您可以使用它

.container{
显示器：flex；
宽度：100%；
}
.container>div{
填充物：5px；
}
.测试输入{
弹性：1；
显示器：flex；
}
.测试输入{
弹性：1；
}

男性的
女的
按钮

谢谢，但我只能看到测试输入类的定义，看不到测试单选项和测试按钮？因为我决定用.container>div分别在每个.test xxx上设置每个容器子级的填充，所以不需要它们。但这段代码只是概念的证明，因为您正在使用某种框架，所以简短的回答是“使用FlexBox”。谢谢，但我认为您删除了测试输入，而不是测试无线电