0

MacでWebページを作成しました。Chrome、FF、Safariなどの一般的なブラウザでテストしました。それは完璧です。IEでウェブサイトをテストする機会を得ました。悲惨に見えます-ロゴが右に行き過ぎています。これを引き起こしているのはフロートだと思います。ここにいくつかのコードを投稿して、ここの専門家からの助けを得ることを望んでいます。plsは私を助けます。ありがとう！

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<style>

   *{
margin:0px; padding:0px;
font-family: Tahoma, sans-serif;
font-size: 11px;
    }


    root { 
    display: block;
    }

    html, body, form, h1, h2, h3, h4, ul, li {
margin: 0;
padding: 0;
    }

    body {
    margin: 0 auto;
    text-align: center;
    width:780px;
    }

    #top_bkg {
    padding:0;
    margin:0 auto;
    background-color:#009933;
    width:780px;
    height:101px; 
    }

   #top_bkg2 {
   background-color:#009933;
   width:780px;
   height:99px; 
   }


   #logo {    
    float:left;   
    line-height: 1%;
    margin-top:-132px;              
background-color:red;
    width:569px;
    height:109px;
background-repeat:no-repeat;
background-position:bottom right;
    }

</style>



    </head>
    <body>

        <div id="top_bkg">
        </div> <!--end of top_bkg-->

        <div id="top_bkg2">
        </div> <!--end of top_bkg2-->


     <div id="logo">             
     </div> <!--end of logo-->


   </body>
  </html>

IEでは次のようになります。

赤い背景がロゴになっています。 その整列から外れています。

4

1 に答える 1

1

幅を本体に設定する代わりに、次のようなラッパーを作成できます

<div id="wrapper"></div>ラッパーの幅を設定します。また、マイナスの値でマージンを指定することはお勧めできません。また、各divの幅と高さを設定しているため、IEではそのように見えます。IEのマージンとパディングに関して修正が必要になる場合がありますが、修正を行うとIEで見栄えが良くなります。

于 2012-05-14T07:16:11.953 に答える