IE和Firefox中的CSS绝对定位问题,但不是Chrome - Wordpress模板



我修改了一个WordPress响应式主题,在标题中包含我客户的徽标。添加这个时,我已经敲了一堆其他div,我正在慢慢地将它们重新拼凑在一起。

我遇到的主要挑战是

#header-menu 

ID ( http://ubcf2.garyspagnoli.com ) 在某些浏览器上无法正确呈现。它固定在右侧,不再响应设计。

这是我实现的CSS(并查看网站),看看我是如何将其定位在徽标图像上的 -

#header-menu {
    bottom: 0;
    padding: 0;
    position: absolute;
    right: 0;
}

关于如何解决这个问题的任何建议?我不能在响应式设计中绝对定位吗?

删除您的h1#site-title

#header-menu{
    background-image:url('http://ubcf2.garyspagnoli.com/wp-content/uploads/2014/02/UBCF-v1.jpg');
    list-style-type:none;
    margin:0px;
    padding:0px;
}
#header-menu>li{
    float:right;
}
#header-menu>li a{
    display:block;
    padding:10px 15px;
}
#header-menu>div{
   float:clear;
}

在最后一个列表项之后添加一个div。您可能需要反转列表项。还要尝试删除任何不必要的位置。

最新更新