Flaticon CSS圖標的大小問題

我開始試圖從http://www.flaticon.com Flaticon CSS圖標的大小問題

包含一些圖標我得到它的工作，但我的問題是，因爲我增加圖標的大小，越來越多的它開始佔據其容器外部空間和因此與其他內容重疊或切斷。我在下面有一個實時鏈接。我調整了所有可以解決這個問題的CSS（可以解決這個問題）（顯示，填充，邊距），並且似乎無法讓它擴展容器來容納自己，而不會侵犯它上面的元素。任何想法將不勝感激！我已經嘗試了很多其他的圖標庫，我最喜歡這個，所以我真的很想找到解決方案。我發現奇怪的是，沒有人遇到過這個相同的問題，也許是我的網頁上的其他內容干擾了我的圖標樣式？

鏈接：http://stnatoday.com

一些圖片：（下頁上） enter image description here
（更高的頁面上）我的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"; 
}

來源

2015-03-31 Osman

我不知道到底是什麼你想但是當使用字體時，「行高」屬性通常可以解決問題（參見http://www.w3schools.com/cssref/pr_dim_line-height.asp）也許你可以解釋w理想的結果應該是。

來源

2015-03-31 21:04:18 gekko42

老實說，我不知道我是怎麼想的，我想我忘了這是一個字體。你先生太棒了！那正是我需要的！ – Osman 2015-03-31 22:05:37

Flaticon CSS圖標的大小問題

回答

相關問題