0

我的网站上有两个部分的问题

我希望导航菜单看起来像所附图像：

侧面导航菜单示例

我遇到的第一个问题是让导航菜单显示在页面右侧。我想我的边距设置正确，但菜单在到达黄色边框的右侧后没有出现。

其次是左侧网站主体后面的小横幅。我为此创建了一个图像，但是当我尝试放置它时，它不会出现在正确的位置。现在我把它设置为重复，这样你就可以看到它在哪里（以及一些时髦的定位）。有没有办法让显示在实际菜单链接下方的部分显示出来？

4

3 回答 3

1

您可以使用纯 css 来实现这种效果。

HTML

<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-58" id="menu-item-58">
    <a href="http://ranchocordovaeventscenter.com/?page_id=57">Building Facts</a>
    <div>
       <div class="wrap-behind"></div>
    </div>
</li>

CSS

#extra-navbar .menu-item {
    margin-bottom: 0.9rem;
    margin-left: 20px;
}

.wrap-behind {
    background: none repeat scroll 0 0 #F9B233;
    border-left: 13px solid transparent;
    border-right: 1px solid #053053;
    border-top: 10px solid #053053;
    float: left;
    height: 0;
    width: 0;
}

#extra-navbar ul li {
    background-attachment: scroll;
    background-color: #104571;
    background-position: left bottom;
    background-repeat: no-repeat;
    color: #FFFFFF;
    overflow: visible;
}
于 2013-02-10T01:20:35.673 回答
0

div #page 有类 .site 与规则overflow: hidden;它导致第一个问题

于 2013-02-10T01:08:53.797 回答
0

在第 1431 行的 style.css 中，您拥有属性overflow: hidden。删除它，您将看到菜单左侧的内容。这应该对你的两个问题都有帮助。

于 2013-02-10T01:08:54.983 回答