CSS工作但不是Chrome浏览器

问题描述：

我添加了一个搜索菜单在WordPress的HTML的header.php：CSS工作但不是Chrome浏览器

<!-- Collect the nav links, forms, and other content for toggling --> 
        <?php 
        // Main menu 
        echo $primary_menu; 
        ?> 
        <div id="search"><?php get_search_form();?></div> 
          </div><!--end container-->

我加<div id="search"><?php get_search_form();?></div>现有的模板。

我已经取得了一些风格的改变，搜索菜单：.input-group .form-control {height:36px !important;}

这些变化是在Firefox中实现的，但无法在Chrome可见。当我用Firebug检查元素时，可以看到代码可见。当我检查Chrome中的元素时，它根本没有（据我所知）出现。

我应该没有应用任何跨浏览器的CSS吗？我犯了什么重大罪？

该网站的网址是：Homepage

感谢。

*“我犯了什么主要罪？”*您需要包括只需要最少量的代码复制问题在帖子本身给我们一个[ MCVE。 –

看起来像它在我身边http://i.imgur.com/uNfNnb0.png –

我想你冲洗了你的浏览器缓存？如果没有尝试ctrl-f5进行硬刷新，开发工具设置禁用缓存，隐私模式ctrl + shift + n。 – keyBeatz

答

您正在使用太多的“！重要”语句。你的CSS显示：

.input-group { 
    margin-top: 10px !important; 
    width: 380px !important; 
    background-color: #f4f4f4 !important; 
    height: 30px !important; 
    margin-left: 450px !important; 
}

然后：

.input-group .form-control { 
    height:36px !important; 
}

所以你申请两次重要的，它是造成问题的原因。请删除声明，它应该工作：

.input-group { 
    margin-top: 10px !important; 
    width: 380px !important; 
    background-color: #f4f4f4 !important; 
    height: 30px; 
    margin-left: 450px !important; 
} 

.input-group .form-control { 
    height:36px; 
}

CSS工作但不是Chrome浏览器

相关推荐