CSS 在 Opera 和 IE 中看起来很糟糕；我应该从哪里开始？

发布于 2024-09-15 11:09:17 字数 2114 浏览 3 评论 0原文

我刚刚完成了我的网站，它在 FF、Safari 和 Chrome 中看起来都不错。 Opera看起来不错，但不如FF。 IE看起来很糟糕。

是否有任何应用程序可以检查不良 CSS 并修复它？如果没有，跨浏览器调整网站最简单的方法是什么？

以下只是我在外观方面遇到的众多问题之一......

我在index.html 中有一个表单，其中包含多个输入。在输入的右侧，有一个用于提交表单的“搜索”按钮。该按钮应该位于右侧，但有时会下降一行，最终位于输入下方的左侧。这种情况仅发生在 Opera 10.53 和 IE 浏览器中。（尚未测试任何其他 Opera 版本）。

这是代码：

<table border="0" align="center">
  <tr>
    <td>
      <div class="nav_container" id="nav_container">
        <div id="nav_container2" class="nav_container2">
          <form id="nav_form_main" name="nav_form_main" action="/search/" target="iframe001" method="get" onSubmit="reset_and_subm();">
            <div class="nav_lists" id="nav_list">
              <input name="nav_querystring" type="text" id="nav_querystring" style="width: 240px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold;" value="">
              <select name="nav_category_list" size="1" id="nav_category_list" style="width: 195px;" onChange="subcatSelection();">
                <option value="All categories" selected>-- All categories --</option>
                ALOT OF OPTIONS HERE
              </select>
              <select name="nav_city_list" id="nav_city_list" style="width: 180px;" onChange="areapicker();">
                <option id="Hela Sverige" value="Hela Sverige" selected>-- Hela Sverige --</option>
                ALOT OF OPTIONS HERE
              </select>                 
              <input type="submit" name="nav_submit" id="nav_submit" value="Sök" style="width: 58px; font-size: 13px;">
            </div>
          </div>
        </td>
      </tr>
    </table>

这里是涉及的 CSS：

.nav_container2 {
  position:relative;
  left:0px;
  top:10px;
}

.nav_container {
  background-image: url(../Graphics/menu_lvl1.gif);
  height: 101px;
  width: 720px;
  padding:0;
  margin:0;
}

如果您需要更多输入，请告诉我...

当然，这里问题最多的是 IE...Opera 中的一些问题，正如我上面提到的...其余的是美好的。

谢谢

原文

I have just completed my website, and it looks good in FF, Safari and Chrome.
Opera looks alright, but not as good as FF.
IE looks very bad.

Is there any application for checking bad CSS and just fix it?
If not, what is the easiest way to cross-browser adjust a website?

Below is only one of the many problems I have with appearance...

I have a form in index.html which contains several inputs. To the right of the inputs, I have a "Search" button which submits the form. This button SHOULD be on the right, but sometimes drops one line to end up on the left below the inputs. This happens only in Opera 10.53 and IE browsers. (haven't tested any other Opera version).

Here is the code:

<table border="0" align="center">
  <tr>
    <td>
      <div class="nav_container" id="nav_container">
        <div id="nav_container2" class="nav_container2">
          <form id="nav_form_main" name="nav_form_main" action="/search/" target="iframe001" method="get" onSubmit="reset_and_subm();">
            <div class="nav_lists" id="nav_list">
              <input name="nav_querystring" type="text" id="nav_querystring" style="width: 240px; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold;" value="">
              <select name="nav_category_list" size="1" id="nav_category_list" style="width: 195px;" onChange="subcatSelection();">
                <option value="All categories" selected>-- All categories --</option>
                ALOT OF OPTIONS HERE
              </select>
              <select name="nav_city_list" id="nav_city_list" style="width: 180px;" onChange="areapicker();">
                <option id="Hela Sverige" value="Hela Sverige" selected>-- Hela Sverige --</option>
                ALOT OF OPTIONS HERE
              </select>                 
              <input type="submit" name="nav_submit" id="nav_submit" value="Sök" style="width: 58px; font-size: 13px;">
            </div>
          </div>
        </td>
      </tr>
    </table>

And here is the CSS involved:

.nav_container2 {
  position:relative;
  left:0px;
  top:10px;
}

.nav_container {
  background-image: url(../Graphics/menu_lvl1.gif);
  height: 101px;
  width: 720px;
  padding:0;
  margin:0;
}

If you need more input just let me know...

Of course, it is IE with the most issues here... Some in Opera as I mentioned above... Rest is fine.

Thanks

分享到QQ

分享到微博