这是我的代码,但所有内容都排在标题的左侧,我似乎找不到任何可以更改布局的内容。我需要给div添加参数还是需要使用float?提前致谢。
<div class="dropdown">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Home
</button>
</div>
<div class="dropdown" style="float: right">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Our Company
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown 1" href="#">Our History</a>
<a class="dropdown 2" href="#">Facilities</a>
</div>
<div class="dropdown">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Employee Services
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown" href="#">Forms</a>
<a class="dropdown" href="#">Pay Stubs</a>
<a class="dropdown" href="#">Employee Handbook</a>
</div>
<div class="dropdown">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton4" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Tickets
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown 1" href="#">IT Service Ticket</a>
<a class="dropdown 2" href="#">Purchasing Ticket</a>
<a class="dropdown 3" href="#">Maitenence Ticket</a>
</div>
</div>
</div>
</div>
</div>
最佳答案
我在 Bootply 中创建了这个.我绝对认为有一些 HTML 格式问题导致了这个问题。
有关闭</div>
缺少的标签,但无论如何这里是您的代码重写以适应您想要实现的目标。
<div class="row">
<div class="dropdown col-md-2">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Home
</button>
</div>
<div class="dropdown col-md-2">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Our Company
</button>
<div class="dropdown-menu col-md-2" aria-labelledby="dropdownMenuButton">
<a class="dropdown 1" href="#">Our History</a>
<a class="dropdown 2" href="#">Facilities</a>
</div>
</div>
<div class="dropdown col-md-2">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Employee Services
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown" href="#">Forms</a>
<a class="dropdown" href="#">Pay Stubs</a>
<a class="dropdown" href="#">Employee Handbook</a>
</div>
</div>
<div class="dropdown col-md-2">
<button class="btn btn dropdown-toggle" type="button" id="dropdownMenuButton4" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Tickets
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown 1" href="#">IT Service Ticket</a>
<a class="dropdown 2" href="#">Purchasing Ticket</a>
<a class="dropdown 3" href="#">Maitenence Ticket</a>
</div>
</div>
</div>
Bootstrap Grid System绝对是您的不二之选。
如果这有帮助,请告诉我。
关于html - 当每个按钮都有一个 div 时,如何在 ASP.NET MVC 中并排获得按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46307955/