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

回答

相关问题