如何仅为IE应用CSS样式

Question

我正在尝试修复我的网站在Internet Explorer中的显示方式。在搜索互联网时，我会浏览以下代码，以便仅为IE应用CSS样式。我已经附加了2张图片，1个网站在IE中（电话号码，菜单没有正确显示），第2个站点在Firefox中以及它应该如何显示。

我目前正在浏览网站以尝试解决这些问题，但需要一些建议，以确保我应用正确的代码，以便在所有IE版本中正确显示并且不会弄乱浏览器上的任何内容。

理想情况下需要一些帮助才能正确显示菜单和电话。目前我已将以下代码应用于我的样式表，该样式表在徽标和菜单中添加了正确的间距，但菜单仍显示在2行中。

我的css：

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

#blue {
    width: 31px;
    height: 52px;
    float: left;
    position: relative;
    padding: 15px 0 0 420px;
}

.brand {
    width:261px;   
  }  

  .header-search {
    width:679px;
  }

.icemegamenu > ul > li  a.iceMenuTitle {
    padding: 1px 5px 0 5px;
  }

可以在http://www.leicesterbakery.co.uk

查看网站本身

非常感谢任何解决这个问题的建议。

提前致谢。

更新

我设法编写了以下CSS代码，修复了我对桌面屏幕大小的问题。不幸的是，这样在响应方面的代码就像样式表中的代码一样，当我在任何像firefox这样的浏览器中调整屏幕大小时，这并没有正常显示。

任何想法如何解决这个问题。

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

.body .container {
  padding: 10px 9px;
  }

.brand {
    width:221px;   
  } 

.brand img {
    max-width:90%; 
    padding-top:10px;
  }

.icemegamenu > ul > li  a.iceMenuTitle {
    padding: 1px 23px 0 23px;
  }

好的，我已经设法通过向IE的媒体标记添加（min-width：980px）来解决响应式代码的问题。最后一个问题是将IE和Firefox上的tel no对齐到页面右侧......任何建议都将不胜感激。

Answer 1

我减少了#blue div上的左边距，这似乎得到了一行的数字。

Answer 2

如果你想要一个特殊的IE浏览器，你可以这样做：

<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

你可以像这样添加IE的版本：

<!--[if IE 7]>
    <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

或者如果您只想使用一种风格，请点击此链接

的引用：https://css-tricks.com/how-to-create-an-ie-only-stylesheet/