为什么此搜索按钮在Google Chrome中看起来有所不同?

时间:2015-12-07 16:43:43

标签: jquery html css

在此SITE中,主页上有一个表单。 (如果您在第一次访问期间无法看到该表单,请再次刷新页面。)

表格在火狐中看起来不错。 据我所知,我已经使用了定制的CSS。

但它在Google Chrome中看起来不行吗?

另外,对于较小的屏幕,如何将所有字段宽度设置为100%?我试过但搜索按钮没有下降。

我想我想念与Positiondisplay相关的事情。

这是我正在使用的媒体查询

#search_btns_h { margin-left: 3% !important; padding: 4.5% 38.5% !important; }
.hotel-day-select { height: 42px; border-radius: 3px; width: 230px; }
@media only screen and (min-width:240px) and (max-width: 1135px)  {
    .hotel-destination { width: 100%; margin-bottom: 9px;}
}
@media only screen and (max-width : 1380px) {
    #search_btns_h {
        margin-left: 21% !important;
        padding: 4.5% 29.5% !important;
    }
}
@media only screen and (max-width : 1373px) {
    #search_btns_h {
        margin-left: 22% !important;
        padding: 4.5% 28.5% !important;
    }
}
@media only screen and (max-width : 1317px) {
    #search_btns_h {
        margin-left: 23%;
        padding: 4.5% 27.5%;
    }
}
@media only screen and (min-width:240px) and (max-width: 1135px) {
    .hotel-date-times > li { width: 100%; margin-bottom: 9px; }
}

如何调整CSS或其他代码以使搜索按钮和其他字段在浏览器兼容性和响应性方面发挥作用?

[编辑]

清除G.hrome中的缓存后:http://tinypic.com/r/b4wcj8/9并在FF中显示相同的页面:http://tinypic.com/r/2ldhqvq/9

1 个答案:

答案 0 :(得分:0)

你应该在div .search-button > div

上设置一个宽度