HTML 图像在 chrome 和 safari 上未对齐答案

【问题标题】：HTML Images are misalign on chrome and safariHTML 图像在 chrome 和 safari 上未对齐
【发布时间】：2014-02-19 16:38:35
【问题描述】：

我一直在尝试让我的页面在不同的浏览器上运行，它似乎只在 IE 上运行，而在其他浏览器中，我的所有图像都未对齐。我不太擅长 HTML，自从我上次使用 html 以来已经有一段时间了，请检查下面的代码。我需要我的页面为 640 x 480 像素。谢谢

    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AD</title>
</head>

<body>
<table width="640" border="0" align="center" cellpadding="0" cellspacing="0">
  <div style="{z-index:3;}">
<img src="images/Header.gif" width="640" height="110"
/div>
<div style="{position: absolute; top: 145; left: 310; z-index:3;} font-family:Arial, Helvetica, sans-serif; font-size:22px; color:#000000;">at</div>

<div style="{position: absolute; top: 115; right: 185; z-index:3;}">
<img src="images/Brush.gif" width="100" height="215"
</div>
<div style="{position: absolute; top: 20; right: 145; z-index:3;}">
<img src="images/LOGO.gif" width="330" height="85"
</div>
<tr>

    <td align="center" valign="top" bgcolor="#f0f8ff" style="background-color:#f0f8ff; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000000; padding:8px;"><table width="80%" border="0" cellspacing="0" cellpadding="0" style="margin-top:10px;">

<center> text 1 <br><b>Competitive text2
<br>text3</b>
<br></center></div></td>
<br>
<center> <div style="font-size=20px;"> text4
<br>text5K.<br>
          </center></div>
<br>

  </tr>
      </table></td>
  </tr>
  <tr>
  <tr>
 <tr>
    <td align="left" valign="top" bgcolor="#00000" style="background-color:#00000;"><table width="100%" border="0" cellspacing="0" cellpadding="7">
      <tr>
        <td align="left" valign="top" style="color:#ffffff; font-family:Arial, Helvetica, sans-serif; font-size:16px;"> <center><b>Apply online today at <font color=#6699ff> &nbsp;<a href="http://www.startek.com/careers/" style="text-decoration: none; color:#6699ff;">www.startek.com/careers</a></font></b>

</td>
<tr>
<td align="center" style="color:#ffffff; font-family:Arial, Helvetica, sans-serif; font-size:13px;"> <center>address
<br><b>tel.no.</b>
</td>

      </tr>
    </table></td>
  </tr>

</body>
</html>

【问题讨论】：

您可以将 css 用于不同类型的浏览器，查找更多信息：thesitewizard.com/css/excludecss.shtml
我试图很好地缩进你的代码，但它的格式太错误了，我不能......
^ 我同意。如果您想开发软件，无论是 web 还是 pc，都要进行适当的缩进。
你试过什么？你在哪里看到问题？尝试详细说明一下，而不是发布“为我修复我的东西”的问题。

标签： html google-chrome safari

【解决方案1】：

利用 CSS 布局元素，例如 position。您的代码仅适用于某些浏览器，因为某些格式不跨浏览器兼容。

我建议您使用 CSS 进行格式化，因为您使用的一些 HTML 格式已经被弃用。这是一个不错的CSS tutorial

【讨论】：

【解决方案2】：

我也遇到了同样的问题...由于 HTML 输出可能因浏览器而异，您应该使用 adobe dreamweaver。它具有在默认情况下在所有浏览器中输出相同 HTML 的功能...顺便说一句..我不知道是怎么回事。

如果您现在买不起dreamweaver..请确保您将position 属性包含在 div 标签正确。

试试这样：

<div position=absolute>main panel</div>

【讨论】：