什麼CSS元素使這個文本如此之小？

Question

如果你去這裏 - http://www.joecrabtree.com/store - 並添加一個產品到購物車，購物車中的所有文本都比其他所有文本小。

我已經在Chrome中的元素檢查器中玩過了，我找不到任何我可以改變的東西，這會使購物車文字更大，而不會影響頁面上其餘的文本。

也就是說，我不明白是什麼讓它比其他所有東西都小。

Answer 1

貌似封閉<td>標籤包含以下樣式：

media="all" 
body, caption, th, td, input, textarea, select, option, legend, fieldset { 
    font: 0.75em/1.6em Helvetica, Arial, sans-serif; 
} 

從style.css中的第34行。我發現你對錶格單元的嵌套父母有類似的規範。這些可以產生累積效應。

我可能建議你指定點或像素的字體大小？

Answer 2

styles.css的線34：

body, caption, th, td, input, textarea, select, option, legend, fieldset { 
    font: 0.75em/1.6em Helvetica,Arial,sans-serif; 
} 

Answer 3

問題似乎是級聯小於1EM的字體大小：

來自螢火蟲：

#cart-block-contents-ajax 0.9em style.css?H (line 870) 

#page font-size: 0.83em style.css?H (line 30) 

.sidebar font-size: 0.95em style.css?H (line 297) 

body font-size: 100% layout.css?H (line 149) 

body font-size: 0.75em style.css?H (line 34) 

td   font-size: 0.75em style.css?H (line 34) 

所以body設置爲100%，則將其重置爲0.75em，然後.83em（#page），然後將.95em（.sidebar），然後.75em（TD）和最後.9em（＃車 - 嵌段 - 含量的Ajax）

所以這是的的100％= 0.399 0.75 0.83 0.95 0.75 0.9 EM

Answer 4

em字體大小是相對於電流的大小..

當有font-size不同爲1，那麼你得到逐步更大或更小的字體在嵌套你去更深層次的嵌套元素..

示例http://jsfiddle.net/gaby/NcKNF/

您的代碼有字體大小爲td元素，甚至更高的DOM您有#cart-block-contents-ajax與0.9em字體大小。和和..

你目前的結構是

 
#page 0.83em 
    .sidebar 0.95em 
     #ajaxCartUpdate 0.95em 
      #cart-block-contents-ajax 0.9em 
       td 0.75em 

所以它變得越來越小，你在DOM去更深

Answer 5

您可以添加到您的CSS，它會覆蓋任何其他CSS導致你的字體很小..這隻會影響你的購物車中的東西。

/*cart item */ 
.block .content #cart-block-contents-ajax .cart-block-items tbody .odd {font-size:15px;} 

/* remove product links */ 
.block .content #cart-block-contents-ajax .cart-block-items tbody .cart-block-item-desc {font-size:15px; font-weight:bold;} 

/* Total Items */ 
.cart-block-summary-items,.cart-block-summary-total {font-size:15px; padding:5px} 

/* View cart and Checkout links */ 
.cart-block-summary-links .links {font-size:15px; font-weight:bold;} 

希望這會有所幫助。

，並回答你的問題：這個屬性添加到body是什麼讓您的字體小：

font: 0.75em/1.6em Helvetica, Arial, sans-serif;