1

作業中の Web サイトのページ レイアウトに問題があります。

ここにリンクがあります

右側の青いボックスは IE と Firefox では見栄えがしますが、Chrome、Safari、Opera では短すぎます (テキストがボックスの下部に近すぎます)。

ボックスのコードは次のとおりです。

#testimon {
   background: url("../img/ttm_bg.png") repeat-x scroll 0 0 transparent;
   border-radius: 15px 15px 15px 15px;
   border-top: 4px groove #00D1FA;
   box-shadow: 0 1px 4px 1px #555555;
   font-size: 14px;
   height: 788px;
   margin-top: 26px;
   padding: 3px;
   text-align: center;
   width: 262px;
 }
#testimon h4 {
   color: rgba(255, 255, 255, 0.92);
   font-size: 19px;
   margin: 8px 0 17px 0;
   text-shadow: 1px 2px 2px #1A1A1A;
 }
#testimon p {
   font-family:Georgia, "Times New Roman", Times, serif;
   color: rgba(0, 0, 0, 0.88);
   line-height:25px;
   font-size: 14px;
   font-style: oblique;
   font-weight: bold;
   text-shadow: 0 1px 1px #CCCCCC;
 }
#testimon .quote {
   font-size:25px;
   padding:4px;
 }
#testimon .signature {
   color: #e6e6e6;
   font-style: normal;
   margin-bottom: 15px;
   text-shadow: none;
 }
#testimon .spacer2 {
   background: url("../img/stars.png") no-repeat scroll 98px 0 transparent;
   height: 13px;
   margin: 31px 0 15px 0;
   width: 262px;
 }

助けてくれてありがとう！

4

3 に答える 3

2

問題はクロスブラウザーの問題ではなく、スタイリングの問題です。その証言 div の高さが固定されているため、誰かが指定したフォントとは異なるフォントを使用したり、ブラウザーのフォントサイズを大きくしたりした場合、テキストはスピルオーバー (Firebug を使用してフォントをアップしたときのように)。

height解決策は、要素からを削除#testimonし、背景が垂直方向に繰り返されるようにすることです (現在はそうではありません)。

于 2013-08-17T17:49:01.573 に答える
0

これはおそらくフォント レンダリング関連の問題です。ブラウザごとにサイズが微妙に違うので、エンド全体の高さが違います。heightから値を削除します#testimon。

于 2013-08-17T17:48:42.087 に答える
0

Chrome、Opera、Maxathon、Firefox、Safari、IE でサイトを見てみると、すべてのブラウザが現在のバージョンのブラウザです。絵も文章もいい感じです。私が確認できた唯一の問題は、画像を拡大するために画像を 2 回または 3 回クリックする必要がある一部のブラウザーでした。

ブラウザのキャッシュをクリアし、ブラウザを閉じてから再度開くことをお勧めします。

于 2013-08-17T18:02:39.237 に答える