我想看起来像是语言标签并在同一行中选择选项,但是我无法使用bootstrap col-md-6在同一行中将它们放在同一行中,整个表格被分隔为同一行内的col-sm-6列。
正如您在图像语言标签上看到的,并且select在同一行上看起来不像,彼此之间相距很远,并且select字段缩小了。如何使它们在同一行上看起来正常?
这是我在下面尝试的:
<div class="row" style="margin-left:10px;">
<div class="col-sm-6">
<ul class="list-unstyled">
<li>
<div class="row">
<div class="col-md-6">
<h4>Language:</h4>
</div>
<div class="col-md-6" style="text-align:left">
<mat-form-field>
<select matNativeControl required>
<option value="english">English</option>
<option value="german">German</option>
</select>
</mat-form-field>
</div>
</div>
</li>
</ul>
<div class="col-sm-6">
...other form elements
</div>
</div>
最佳答案
将以下内容替换为您的h4
标记
<h4 style="display:inline">Language:</h4>
演示Stackblitz
关于javascript - 如何将 Material 选择和标签并排放置在同一行中,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58172423/