Question

我正在尝试将数据列表与其按钮对齐并增加其数据列表框的大小。我尝试在输入列表中放置align =“center”，但没有得到任何更改。也不知道如何增加盒子的大小并使其响应。请帮忙

代码：

<input list="category" name="category" id="textcat">
<datalist id="category">
  <option id="www.google.com" value="fruits" />
  <option id="www.fb.com" value="animals" />
  <option id="www.ymail.com" value="vechiles" />
  <option id="www.msn.com" value="ornaments" />
</datalist>
<input id="btn" type="button" value="submit">

Answer 1

通过使用正确的标记，您可以轻松完成此操作！只需添加一个额外的div和引导默认类text-center。试试这段代码

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="container">
  <div class="row">
    <div class="col-md-6 col-md-offset-3">
      <div class="text-center">
        <form action="" class="form-horizontal">
          <div class="form-group col-sm-8 col-xs-12">
            <input type="text" class="form-control" list="category " name="category " id="textcat ">
            <datalist id="category ">
              <option id="www.google.com " value="fruits " />
              <option id="www.fb.com " value="animals " />
              <option id="www.ymail.com " value="vechiles " />
              <option id="www.msn.com " value="ornaments " />
            </datalist>
          </div>
          <div class="form-group col-sm-4 col-xs-12">
            <input class="btn btn-success btn-block" id="btn" type="button" value="submit ">
          </div>
        </form>

      </div>
    </div>
  </div>
</div>

＆＃13;

如何居中对齐数据列表及其按钮

1 个答案: