Flaticon CSS图标大小问题

Question

我开始尝试合并http://www.flaticon.com

中的一些图标

我得到了它的工作但我的问题是随着我增加图标的大小越来越多它开始占据其容器外的空间，因此重叠其他一些内容或切断。我在下面有一个实时链接。我已经调整了我能想到的CSS中可以解决这个问题的一切（显示，填充，边距），并且似乎无法将其扩展到容器本身而不会侵犯它上面的元素。任何想法将不胜感激！我已经尝试了很多其他库的图标，我最喜欢这个，所以我真的想找到一个解决方案。我觉得很奇怪，没有其他人遇到同样的问题，也许我的页面上的其他东西干扰了我的图标样式？

链接：http://stnatoday.com

部分图片： （在页面下方）
（页面上更高） 我的CSS

@font-face {
     font-family: "Flaticon";
     src: url("flaticon.eot");
     src: url("flaticon.eot#iefix") format("embedded-opentype"),
          url("flaticon.woff") format("woff"),
          url("flaticon.ttf") format("truetype"),
          url("flaticon.svg") format("svg");
    font-style: normal;
 }
 [class^="flaticon-"]:before, [class*=" flaticon-"]:before,
 [class^="flaticon-"]:after, [class*=" flaticon-"]:after {   
    font-family: Flaticon;
    font-size: 25em;
    font-style: normal;
    margin-left: 20px;
 }
.flaticon-job-search1:before {
     content: "\e001";
}

Answer 1

我不确切地知道你想要什么，但在使用字体时，＆＃34; line-height＆＃34;财产经常解决问题（见http://www.w3schools.com/cssref/pr_dim_line-height.asp） 也许你可以解释一下应该得到的结果。