Question

我刚开始使用css进行个人项目，我希望在另一侧显示一组图标并对齐，我发现它们中的一部分在字体上很棒，其他部分在aenter代码上另一个数据库。

问题是上面部分中非填充溢出的非字体图标。我仍然可以使用更多填充来对齐它们，但是这样设计就不再响应了，并且调整了它们不对齐的窗口大小。

的情况

在阅读了关于font-awesome默认填充的内容后，我尝试重置它但没有工作。

这是其中一个部分的css和html：

＆＃13;

.one-fourth {
  width: 20%;
  float: left;
  text-align: center;
  color: #e0e0e0;
  background-color: #4fb3bf;
}

#python i {
  vertical-align: bottom;
  border: 3px solid red;
  padding-top: 2.55%;
}

.one-fourth i {
  color: #e0e0e0;
  max-height: 100px;
  font-size: 500%;
  padding: 13% 0 4%;
}

＆＃13;

<section class="one-fourth" id="python">
  <td>
    <i class="icon-python"></i>
  </td>
  <h3>Python</h3>
</section>

＆＃13;

Answer 1

在摆弄了值和各种函数后，我发现唯一的方法是不使用填充的块对齐百分比值，而是使用px值，而不是

#python{
    padding-top:2.55%;
}
.one-fourth{
    :padding-top:13%;
}

我必须使用

#python{
    padding: 34px 0 0;
}
.one-fourth{
    padding: 30px 0 20px;
}

Css图标填充溢出部分框

1 个答案: