Question

我正在尝试向右移动一行列，每行包含一个按钮，以便它位于页面的中间位置。

<div>
<div class="container-fluid" id="home">
  <h1>Welcome to Daniel's Portafolio</h1>

<div class="row">
   <div class="col-md-2">
  <a href="https://www.linkedin.com/in/daniel-ramirez-b38203118">
    <button class="btn btn-default btn-social-icon btn-xl"><i class="fa fa-linkedin"></i> LinkedIn</button>   
  </a>
  </div>
  <div class="col-md-2">
   <a href="https://github.com/tadm123">
    <button class="btn btn-default btn-social-icon btn-xl"><i class="fa fa-github"></i> Github</button>   
  </a>
  </div>
  <div class="col-md-2">
  <a href="freecodecamp.com/tadm123">
    <button class="btn btn-default btn-social-icon btn-xl"><i class="fa fa-free-code-camp"></i> freeCodeCamp</button>   
  </a>
  </div>
  </div>

我正在尝试使用padding-left：

在CSS中执行此操作

.row { 
    padding-left:300px;
}

它会移动它但它也会改变按钮之间的距离。任何帮助将不胜感激。

Answer 1

您正在使用网格布局。应用左边距不会使列居中。然而，它将进一步限制这些列的宽度，并给它们一些相当奇怪的定位。相反，您需要使用偏移量。

您总共有12列（至少是Bootstrap中的默认值），您的内容使用6（3 x 2）。您需要将第一列偏移3到中心。

<div class="row">
    <div class="col-md-2 col-md-offset-3">

如何将整行向右移动？

1 个答案: