移动菜单定位

Question

我正在使用HubSpot COS构建我的第一个模板。我正在尝试为我的响应式菜单实现移动菜单。

我有一个菜单，我添加了自定义make。 HubSpot提供了一个我在页面页脚引用的JS代码。我可以看到JS的所有内容都按预期工作，但它是我无法弄清楚的CSS定位。

在移动设备上，我的菜单正在向下移动，如果向下移动我无法保持。我尝试使用固定定位移动定位并应用class ="custom-menu-primary"，似乎没有任何工作按预期工作。这个HubSpot文章中提供了JS和CSS的链接。

将移动触发器移动到角落最右上角的最佳方法是什么。这是我网站的link。

http://prntscr.com/elwvyi

Answer 1

在媒体查询部分，对于课程[[12,73,84..],[74,83,94..]] ，请添加：

logo

对于班级float:left; ：

widget-type-space

Answer 2

以下是您的问题的快速解决方法，以下代码暂时解决。

请参考导航栏的bootstrap。 Bootstrap navbar documentation

@media (max-width: 767px)
raw-resource?po…fered=true:863
.mobile-trigger {
    display: inline-block !important;
    cursor: pointer;
    position: fixed;
    top: 30px;
    right: 20px;
    width: auto;
    height: auto;
    padding: 7px 10px 8px 10px;
    background: #ffffff;
    border: 1px solid #000000;
    font-size: 16px;
    font-weight: normal;
    text-align: left;
    text-transform: uppercase;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #000000;
}

@media (max-width: 767px)
raw-resource?po…ered=true:1007
.custom-menu-primary.js-enabled .hs-menu-wrapper {
    width: 95%;
    position: fixed;
    margin: 20px 10px 0px 10px;
    top: 45px;
    left: 0;
    padding: 0;
}