IE 8的CSS问题

我的网站在IE9上看起来不错，但在IE8上看起来不错。 Davideugenepeterson类和id不起作用。任何人都可以指出问题来自哪里？这里是我的CSS：IE 8的CSS问题

@charset "utf-8"; 

body 
{ min-width:839px; 
    max-width:none; 
    margin-left:0; 
    margin-top:0; 
    margin-right:0; 
    margin-bottom:0; 
    background-color:#fff; } 

#Container 
{ margin-left:auto; 
    margin-right:auto; 
    position:relative; 
    overflow:auto; } 

    #Banner 
{ position:relative; 
    background-color:#000; 
    height:37px; 
    width:auto; 
    z-index:1; } 

    #Theportfolioof 
{ 
    position:absolute; 
    text-align:center; 
    width:170px; 
    height:37px; 
    left:-192px; 
    top:9.4px; 
    bottom:0; 
    right:0px; } 

.Theportfolioof 
{ white-space:nowrap; 
    color:#888888; 
    text-align:center; 
    letter-spacing:1.3px; 
    text-transform:uppercase; 
    word-spacing:5px; 
    line-height:3px; 
    font:normal 21px "Quaver Sans"; 
    font-weight:100; 
    margin-left:auto; 
    margin-right:auto; 
    overflow:visible; 
    z-index:1; } 

#Davideugenepeterson 
{ position:absolute; 
    text-align:center; 
    width:170px; 
    height:37px; 
    left:182px; 
    top:1px; 
    bottom:0px; 
    right:0px; } 

.Davideugenepeterson 
{ white-space:nowrap; 
    color:#FFF; 
    text-align:center; 
    letter-spacing:0.8px; 
    text-transform:capitalize; 
    word-spacing:4px; 
    line-height:3px; 
    font :normal 18px "Pacifico"; 
    font-size:18px; 
    font-weight:100; 
    margin-left:auto; 
    margin-right:auto; 
    overflow:visible; 
    z-index:1; } 




#Logo 
{ width:117px; 
    height:117px; 
    background-image:url(images/logo.png); 
    background-repeat:no-repeat; 
    position:absolute; 
    left:0; 
    top:37px; 
    bottom:0; 
    right:0; 
    margin-left:auto; 
    margin-right:auto; 
    z-index:1; }

这里是我的HTML：

<body> 
    <div id="Container"> 
    <div id="Banner"><div id="Theportfolioof" class="Theportfolioof">the portfolio of</div><div id="Davideugenepeterson" class="Davideugenepeterson">david eugene peterson</div></div> 
    <div id="Logo"></div> 
    </div> 
    </div> 
    </div> 
    </body>

这里的IE9浏览器的截图：这是它应该如何看 IE9

这里与IE8的差异。 IE8

我已经与W3C验证吧，CSS是有效的HTML 4.01严格和HTML是有效的为好。任何人都知道问题是什么？这就像它甚至不认识我的设置字体。（是所有的字体被正确安装在我的服务器上）

来源

2012-11-19 David Eugene Peterson

考虑提供小样本...我怀疑你需要所有的CSS和HTML来显示问题。比发现问题更容易。 –

刚刚谢谢@AlexeiLevenkov –

您可能正在测试它在不同的PC上。与IE 9的那个安装了Pacifico和Quaver Sans，另一个没有安装。

这不是Web字体的工作方式。如果你想使用一个自定义的，你必须在CSS定义font-family：

@font-face { 
    font-family: 'MyFontFamily'; 
    src: url('fonts/myfont-webfont.eot?#iefix') format('embedded-opentype'), 
     url('fonts/myfont-webfont.woff') format('woff'), 
     url('fonts/myfont-webfont.ttf') format('truetype'), 
     url('fonts/myfont-webfont.svg#svgFontName') format('svg'); 
}

其中url() containes相对于CSS文件中的字体路径。

如果您没有上述所有格式的字体文件，请使用Font Squirell's @font-face generator。如果你想知道你是否真的需要全部检查The New Bulletproof @Font-Face Syntax。

来源

2012-11-19 20:51:25 Pavlo

有没有在你的.Davideugenepeterson类的属性的一个错字：

font :normal 18px "Pacifico";

应该是：

font: normal 18px "Pacifico";

我的赌注是IE8的CSS解析器正在读取"font "（使用空格）作为属性名称而不识别它。

来源

2012-11-19 19:20:23 daGUY

回答

相关问题