添加填充到fa-fw字體真棒圖標

像標題說我想添加填充圓形字體Awsome圖標與類fa-fw -comming在這裏從Android和Java所以有點困惑，並試圖獲得一個CSS在moent但一部分，我只是想不通：這兒是代碼：添加填充到fa-fw字體真棒圖標

<div class="mainpage"> 
    main-page works! 
<i class="fa fa-credit-card fa-fw" aria-hidden="true"></i> 
</div>

和css：

.fa-fw { 
    background: yellow; 
    padding: 10px; 
}

和我得到的結果是：

編輯：代碼resst：

<div class="main-wrapper" style="background: green"> 
    <app-top-bar (onToggleEmiter)="isMenuClosed =$event"></app-top-bar> 
    <div class="wrapper-sub" [ngClass]="{extendedBar:sidebarIsExpended === true}"> 
    <div class="row container-fluid"> 
     <div *ngIf="(isMenuClosed)===true; else noth" class="weee"> 
     <app-side-bar class="hidde"></app-side-bar> 
     </div> 
     <ng-template #noth> 
     <app-side-bar class="nothidde"></app-side-bar> 
     </ng-template> 
     <app-main-page></app-main-page> 
    </div> 
    </div> 
</div>

來源

2017-09-29 pb4now

什麼是你想要的結果呢？ – bhansa

你還在該頁面上有什麼？我試着用你的例子，信用卡集中在我的黃色廣場上。 –

@bhansa我想要黃色背景是10px arounf圖標 – pb4now

例如你工作得很好，在這裏你有10px填充有黃色的背景。

.fa-fw{ 
 
    background: yellow; 
 
    padding: 10px; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" /> 
 

 
<div class="mainpage"> 
 
    main-page works! 
 
    <i class="fa fa-credit-card fa-fw" aria-hidden="true"></i> 
 
</div>

來源

2017-09-29 17:13:53 bhansa

yeap，爲什麼h ** l它對我不起作用：/ - 它可能是它是'容器流體'引導類的孩子U認爲...？：S – pb4now

檢查您的瀏覽器是否有其他樣式應用於相同的元素，並試圖找出，可能有東西重寫這些樣式。 – bhansa

ty建議先生 - 將繼續與（y） – pb4now

添加填充到fa-fw字體真棒圖標

回答

相關問題