Web サイトで作業を行っていますが、ページの要素を Google Chrome または Firefox で正しく表示できないようです。文字通り 1 秒間表示され (接続速度によって異なります)、消えます。私は問題を理解できないようです。Safari と IE では、(予想どおり) 完全に機能します。これは、スクリプトを一切使用しない単純な HTML ページであるにもかかわらず、Chrome と Firefox の両方でローカル (つまり、サーバーまたはローカル サーバーではない) で実行されている場合にも機能します。
これは私が作成したフィドルです:
コード (HTML):
<div id="adbox">
<div class="wrapper clearfix">
<div class="info">
</div>
</div>
<div class="highlight">
<h2>This is a test <i>123</i></h2>
</div>
</div>
CSS:
#adbox {
background: #020a13 url(http://reallygoodpie.com/PArcadeMachines/images/bg-adbox.jpg) no-repeat center top;
font-family: Georgia, "Times New Roman", Times, serif;
background-size: 90%;
min-height: 433px;
margin: -56px 0 22px;
/** Needed for IE7 **/
*margin: 0;
*position: relative;
*top: -56px;
}
#adbox .wrapper {
width: 940px;
padding: 54px 10px 26px;
}
#adbox .info {
height: 354px;
width: 450px;
overflow: hidden;
padding: 20px;
border-radius: 5px;
}
#adbox h1 {
color: #ffffff;
font-size: 48px;
font-style: italic;
line-height: 50px;
margin-bottom: 30px;
}
#adbox p {
color: #176eb0;
font-size: 14px;
line-height: 24px;
}
#adbox p a {
color: #176eb0;
}
#adbox div.highlight {
background: #171a1a url("http://reallygoodpie.com/PArcadeMachines/images/adbox-bg-heading.jpg) repeat-x left top;
min-height: 82px;
border-color: #000;
color: white;
border-style: solid none;
border-width: 1px;
}
#adbox div.highlight h2 {
color: #484b4b;
color: white;
font-size: 34px;
line-height: 82px;
width: 940px;
margin: 0 auto;
padding: 0 10px;
text-shadow: -3px 0 3px #121413;
}
#adbox div.highlight h2 i {
font-weight: normal;
}
どんな助けでも大歓迎です。