Горизонтально центрируйте форму и кнопку HTML

Question

Я использую бутстрап для стайлинга.

Мне удалось центрировать вертикально и горизонтально другие вещи, но не ввод и кнопку.

Ввод и кнопка отображаются в левой части страницы. я пробовал разные варианты класса начальной загрузки, но не смог с этим справиться

body {
  background-color: whitesmoke;
  height: 90%;
  display: flex;
  align-items: center;
}

html {
  height: 90%;
}

.row {
  text-align: center;
}

.random {
  text-decoration: none;
  margin-bottom: 50px;
}

.icon {
  max-width: 25%;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col random">
      <button class="btn btn-primary">
                    <a href="https://en.wikipedia.org/wiki/Special:Random" target="_blank">Click here for a random article</a>
                </button>
    </div>
  </div>
  <div class="row">
    <form class="col icon">
      <input type="text" class="form-control">
    </form>
    <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>
  </div>
  <div class="row">
    <div class="col">
      Click icon to search
    </div>
  </div>
</div>

Answer 1

body {
  background-color: whitesmoke;
  height: 90%;
  display: flex;
  align-items: center;
}

html {
  height: 90%;
}

.row {
  text-align: center;
}

.random {
  text-decoration: none;
  margin-bottom: 50px;
}

.icon {
  max-width: 25%;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col random">
      <button class="btn btn-primary">
                    <a href="https://en.wikipedia.org/wiki/Special:Random" target="_blank">Click here for a random article</a>
                </button>
    </div>
  </div>

    <form class="col icon">
    <div class="row">
      <input type="text" class="form-control">
    </div>
    <div class="row">
     <div class="col">
    <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>  
     </div>
    </div>
  </form>
  
  
  <div class="row">
    <div class="col">
      Click icon to search
    </div>
  </div>
</div>