0

我正在使用 MVC-3 框架设计一个网站。虽然没有使用 IE 兼容模式，但它会正确显示，如下所示：

一个

我正在使用的代码是这样的：

<div id="header">
        <div id="title">                                 /* NUMBER 1 */
            <img src="@Url.Content("~/Content/A_picture.png")" />
        </div>
        <div id="menucontainer">                         /* NUMBER 2 */
            <ul id="menu">
                /* some menu items*/
            </ul>
        </div>
</div>
<div id="main">                                          /* NUMBER 3 */
   @RenderBody()
</div>

有一天，我不得不强迫我的代码相信它正在运行 IE7 以解决其他格式一致性问题。

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

但是现在，强制这样做会破坏我最初的网站布局。在使用 IE7 的强制时，它看起来像这样：

b

感谢您通过解释与我在一起。现在我的问题 - 我如何操纵我的 div 部分，这些部分现在已损坏，以在我的第一张图片中出现，同时仍然强制模拟 IE7？

非常感谢任何想法、想法和建议。

编辑：CSS

我认为可能有助于解决这个问题的一些 CSS 如下。抱歉，我显然应该一开始就包括这个。

header,
footer,
nav,
section {
    display: block;
}

header, #header {
    position: relative;
    margin-bottom: 0px;
    padding: 0;
}

nav, 
#menucontainer {
    margin-top: 40px;
}

div#title {
    display: block;
    float: left;
    text-align: left;
}
4

3 回答 3

1

也许你需要使用vertical-align，因为你应该像这样设置：

#id_top_elements {
  display: table-cell; 
  vertical-align: bottom;
}

但如果你可以展示你的 CSS，它可能是 heplfull ;)

或像这样尝试：

<!--[if lt IE 8]>
<style>
   #id_top_elements {
       position: relative; 
       top: -50%
   }
</style>
<![endif]–&gt;

但现在你需要为顶级元素添加一些包装器，它必须有position: absolute;

于 2012-10-23T14:08:07.740 回答
0

令人惊讶的是，解决方案只是在#menucontainer css 中添加一行，如下所示：

nav, 
#menucontainer {
    margin-top: 40px;
    display: inline;
}

添加的行是“显示：内联”，我将它添加到图表中的数字 2 div。

感谢所有参与此主题的人！

于 2012-10-23T18:51:51.647 回答
0

而不是使用花车，你也可以使用

     display: inline-block; /*which works for most browsers including newer versions of ie, the following two lines are the fix for older versions of ie.*/
     *display: inline;
     zoom: 1;

对需要“坐在”另一个对象/元素旁边的任何对象/元素执行此操作

于 2012-10-23T14:29:12.593 回答