0

これは私のページのソースです:

<html style="height: 100%">
    <head>
        <link rel="stylesheet" media="screen" href="/public/stylesheets/main.css">
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body style="height: 100%; margin: 0px">
    <table>
    <tr>
        <th>
            <img src="/public/images/logo.jpg" alt="logo" id="logo" />
        </th>
    </tr>
    </table>

    <iframe id="testFrame" src="/public/site_down.gif" frameborder="0" style="overflow:hidden;height:100%;width:100%" height="100" width="100">

    </body>
</html>

以下のコードは、Firefox ではページの中央にロゴを表示していますが、IE では左揃えになっています。常に中央に表示されるようにブラウザに依存しないようにするにはどうすればよいですか?

<table>
 <tr>
    <th>
        <img src="/public/images/logo.jpg" alt="logo" id="logo" />
    </th>
 </tr>
</table>

Firefox と IE では iframe コードが左揃えになり、IE では V スクロール バーが表示されますが、Firefox では表示されません。iframe を柔軟にして、クライアントがイメージ/html コードをドロップできるようにして、スクロール バーが表示されずに常に中央に配置されるようにしたいと考えています。

私のCSS

table
{
    border-width: 0 0 1px 1px;
    border-spacing: 0;
    border-collapse: collapse;
    margin:auto;
    vertical-align:middle;
}

td
{
    margin: 0;
    padding: 4px;
    border-width: 1px 1px 0 0;
}
4

1 に答える 1

0

中央揃えのページは通常、次のように機能します。

<body>
    <div id="wrapper">
     ...your side contents...
    </div>
</body>

CSS:

#wrapper {
    width:960px;
    margin-left:auto;
    margin-right:auto;
}

同じテクニックを使用して、画像や Iframe など、あらゆるものを中央に配置できます。クラスまたは ID を指定して、同じ CSS パターンを適用します。

于 2012-11-02T20:31:58.840 に答える