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>

iframe 代码在 Firefox 和 IE 中左对齐，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 回答