爲什麼我的社交媒體圖標很大？

我試圖將一些社交媒體圖標添加到我的頭文件中，它們比他們應該大10倍。我已經通過了CSS並使用了螢火蟲，但我無法找到正在做什麼。爲什麼我的社交媒體圖標很大？

我希望他們是他們的常規大小，並坐在標題的右上角。提前致謝！！

這裏是什麼樣子（http://www.bolistylus.com）：

enter image description here

這裏的style.css中：

a { 
    color: #254655; 
} 

ul, ol { 
    margin: 0 0 0 5.5em; 
} 

#page { 
    margin: 0 auto; 
} 

body{ 
background: #f3f3f3; 
border-top: none; 
border-top: 10px solid #666666; 
} 

#page { 
    margin: 0em auto; 
    width: 1000px; 
} 

.singular.page .hentry { 
    padding: 0.5em 0 0; 
} 

#branding{ 
background: #f3f3f3; 
color: #000000; 
border-top: none; 
position: relative; 
z-index: 2; 
} 

#site-title { 
    /*margin-right: 270px;*/ 
    padding: 0.66em 0 0 0; 
} 

#site-title a { 
    color: #111111; 
    font-size: 60px; 
    font-weight: bold; 
    line-height: 36px; 
    text-decoration: none; 
} 

#branding h1, header#branding a{ 
text-align: left; 
margin-right: 0; 
} 

#branding span{ 
text-align: center; 
} 

#branding img { 
    height: auto; 
    margin-bottom: -.66em; 
    width: 30%; 
} 

#branding .widget{ 
position: absolute; 
top: 2em; 
right: 7.6%; 
} 

#respond{ background: #E7DFD6; }      

.welcome{ 
margin: 15px 60px; 
background: #f3f3f3; 
border: 1px solid #f6ff96; 
padding: 15px; 
text-align: center; 
} 

/* =Menu 
-------------------------------------------------------------- */ 
/*.header_nav ul{ 
    margin: 0; 
    padding: 0; 
    text-align: center; 
    width: 400px; 
    } 
*/ 

#branding img .sm-img { 
    height: auto; 
    margin-bottom: -.66em; 
    width: 100%; 
} 

.header_nav { 
    background: #f3f3f3 
    } 


.header_nav .head-nav { 
    border-bottom: 1px solid #cfcec9; 
    border-top: 1px solid #cfcec9; 
    margin-top: 30px; 
    padding-top: 5px; 
    padding-bottom: 5px; 
    text-align: right 
    } 

.header_nav ul li{ 
    display: inline; 
    } 

.header_nav ul li a{ 
    padding: 10.5px 21px; 
    color: #000000; 
    } 

.header_nav ul li a:hover, .menu ul li .current{ 
    color: #a8cb17; 
    text-decoration: none; 
    } 



#access { 
    background: #f3f3f3; /* Show a solid color for older browsers */ 
} 
#access ul { 
    font-size: 13px; 
    list-style: none; 
    margin: 0 0 0 -0.8125em; 
    padding-left: 0; 
} 
#access li { 
    float: center; 
    position: relative; 
    display: inline; 
} 
#access a { 

} 
#access ul ul { 

} 
#access ul ul ul { 

} 
#access ul ul a { 

} 
#access a:focus { 
} 
#access li:hover > a, 
#access a:focus { 
} 
#access ul li:hover > ul { 
} 
#access .current_page_item > a, 
#access .current_page_ancestor > a { 
    font-weight: bold; 
}

來源

2012-01-18 novicePrgrmr

你在CSS中指定一個百分比寬度多次，這裏的線路：

style.css (line 70) 
    #branding img { 
     height: auto; 
     margin-bottom: -0.66em; 
     width: 30%; //remove 
    } 

    style.css (line 530) 
    #branding img { 
     height: auto; 
     margin-bottom: -7px; 
     width: 100%; //remove 
    }

刪除那些他們應該顯示正常。

來源

2012-01-18 23:18:08

在這裏試着改變你的CSS：

#branding img { 
height: auto; 
margin-bottom: -0.66em; 
width: 3%; /* 3 not 30 */

}

在style.css的線70

來源

2012-01-18 23:17:24 Kath

style.css的第70行是設置一個值爲30％的寬度屬性。這會導致圖像伸展到其容器的30％。

#branding img { 
height: auto; 
margin-bottom: -.66em; 
width: 30%; 
}

將寬度調整爲較低的百分比或完全刪除該行。

來源

2012-01-18 23:19:22

爲什麼我的社交媒體圖標很大？

回答

相關問題