在徽标下移动mainnav-icon

时间:2015-02-20 02:34:22

标签: javascript html css wordpress

目前我正在使用wp主题(http://preview.themezee.com/dynamicnews/),但我稍作调整(http://www.angrycrows.com)。正如您在原始未编辑主题中看到的那样,导航栏将根据浏览器的宽度转入下拉列表。在我的修改版本(angrycrows.com)中它做了同样的事情,但它并没有整齐地定位在徽标下面(因为我所做的改变)。我的问题如下,如何保持我的变化,更大的导航栏位于徽标的右侧,同时还将迷你导航器整齐地放置在徽标下方?下面是愤怒的改变的CSS。

#navi-wrap {
background: #333;
    position: relative;
    bottom: 75px;
    right: 25px;
    float: right;

}

非常感谢。

1 个答案:

答案 0 :(得分:1)

你有#navi-wrap规则的媒体="所有" 如果您想要一个自适应网站,则必须使用媒体查询。

创建管理小屏幕样式的媒体查询。在您的情况下,您的网站将其样式更改为960px,因此您必须为该宽度创建媒体查询

@media (max-width: 960px){
   #navi-wrap {
     background: #333;
     margin: 0 10px;
   }
}

/* your full site style */
@media (min-width: 961px){
   #navi-wrap {
     background: #333;
     position: relative;
     bottom: 75px;
     right: 25px;
     float: right;
   }
}

希望有所帮助。