CSS在Chrome中無法正常工作，而不是在Firefox

CSS無法在Chrome中工作，而不是在FirefoxCSS在Chrome中無法正常工作，而不是在Firefox

原始CSS

background: url("../images/shortcut-button-bg.gif") no-repeat scroll left top #F7F7F7; 
border: 1px solid green; 
display: -moz-inline-stack; 
margin: 0 0 20px; 
width: 201px;

Firfox螢火顯示它作爲

background: url("../images/shortcut-button-bg.gif") no-repeat scroll left top #F7F7F7; 
    border: 1px solid green; 
    display: -moz-inline-stack; 
    margin: 0 0 20px; 
    width: 201px;

，並在Chrome螢火蟲

background: url("../images/shortcut-button-bg.gif") no-repeat scroll left top #F7F7F7; 
    border: 1px solid green; 
    display: -moz-inline-stack; 
    margin: 0 0 10px; 
    width: 140px;

請回復我並告訴我使用CSS的瀏覽器兼容性

來源

2012-10-24 M Arfan

鉻有沒有「螢火蟲」，而是自己的「開發者工具」。 – feeela

@feeela有一個「螢火蟲」鉻... http：//getfirebug.com/firebuglite –

@Pabloker哦 - 好的。現在我可以在任何瀏覽器中使用最慢的代碼檢查器;-) – feeela

當您使用供應商特定的前綴（如display: -moz-inline-stack;）時，它將針對特定的瀏覽器。在這裏，你可能已經猜到了前綴，它只能被firefox理解。這可能是這種情況發生的原因。

嘗試使用像這樣的跨瀏覽器解決方案one。

您可能需要添加的事情是：

display: -moz-inline-stack; //for firefox 
    display: inline-block; //for other browsers 
    *display: inline; //for IE6 & 7 
    zoom: 1; //for IE6 & 7

來源

2012-10-24 13:29:47

不知道這是答案，但Chrome不知道display: -moz-inline-stack;。 display: -moz-inline-stack;也可以使用display: inline-block;。

來源

2012-10-24 13:32:47 SKeurentjes

我嘗試過自己，但Chrome和Firefox顯示寬度：201px; 140px應該在你的風格的某個地方定義。

來源

2012-10-24 13:35:19

嘗試從樣式聲明中丟失-moz-位。大多數現代瀏覽器現在都不需要HTML5。可能的CSS顯示值是： -

none The element will not be displayed at all 
    block The element is displayed as a block element (like paragraphs and headers). A block element has some whitespace above and below it and does not tolerate any HTML elements next to it 
    inline This is default. The element is displayed as an inline element (like span). An inline element has no line break before or after it, and it tolerates HTML elements next to it 
    inline-block The element is placed as an inline element (on the same line as adjacent content), but it behaves as a block element 
    inline-table The element is displayed as an inline table 
    list-item The element is displayed as a list-item, which means that it has a bullet in front of it 
    table The element is displayed as a table 
    table-caption The element is displayed as a table caption 
    table-cell The element is displayed as a table cell 
    table-column The element is displayed as a table column 
    table-column-group The element is displayed as a table column group (like <colgroup>) 
    table-footer-group The element is displayed as a table footer row group 
    table-header-group The element is displayed as a table header row group 
    table-row The element is displayed as a table row 
    table-row-group  The element is displayed as a table row group 
    inherit  The value of the display property will be inherited from the parent element

由於沒有「內聯棧」的價值，你應該使用「內聯」，或完全去掉「顯示」項。它應該閱讀： -

display: inline;

來源

2012-10-24 13:37:15

CSS在Chrome中無法正常工作，而不是在Firefox

回答

相關問題