首页 > 解决方案 > 试图在 Bootstrap 中居中下拉菜单和图标

问题描述

我正在学习 Bootstrap,现在我正在尝试将下拉菜单和图标居中放置在页面中间。我正在使用网格系统,但没有运气。有人可以帮忙吗?

<h1 style="text-align:center;" class="text-left">Joeys Pizza</h1>
<div class="row">
  <div class="col-lg-7">
    <select id="mySelect" title="Select a different week">
      <option value="Option1">Option 1</option>
      <option value="Option2">Option 2</option>
      <option value="Option3">Option 3</option>
      <option value="Option4">Option 4</option>
    </select>
  </div>
  <div class="col-lg-5">
    <i class="fa fa-print" style="font-size:24px"></i>
  </div>
</div>

标签: htmlcssbootstrap-4

解决方案


我不确定你想要什么。但我的理解是你想要居中下拉和图像。

检查这个...


  <h1 style="text-align:center;" class="text-left">Joeys Pizza</h1>
        <div class="row">
            <div class="col-lg-1">&nbsp;</div>
            <div class="col-lg-5 text-right">
                <select id="mySelect" title="Select a different week">
                    <option value="Option1">Option 1</option>
                    <option value="Option2">Option 2</option>
                    <option value="Option3">Option 3</option>
                    <option value="Option4">Option 4</option>
                </select>
            </div>
            <div class="col-lg-5 text-left">
                <i class="fa fa-print" style="font-size:24px"></i>
            </div>
            <div class="col-lg-1">&nbsp;</div>
        </div>

推荐阅读