gpt4 book ai didi

css - 导航上的下拉框未对齐

转载 作者:太空宇宙 更新时间:2023-11-04 13:27:37 24 4
gpt4 key购买 nike

我又需要一些帮助。 “画廊”下我的导航菜单上的下拉菜单未在画廊一词下方对齐,请参阅实时网站:lofthairstudio.ie。

谁能看出我哪里出了问题 - 我希望画廊的下拉内容显示在菜单上画廊一词的正下方,而不是原来的样子。

提前致谢格斯

/* Main Navigation
----------------------------------------------------------- */
/*core styles*/
.dropdown-menu {text-align: center; margin: 0; padding: 0; list-style: none;}
.dropdown-menu li { position: relative text-align: center;}
.dropdown-menu ul {position: absolute; nowhitespace: afterproperty; nowhitespace: afterproperty; nowhitespace:

afterproperty; top: 100%; left: 0; z-index: 99; opacity: 0; visibility: hidden; transition: all .2s ease-in-out; margin: 10px 0 0 0; _margin: 0; /IE6 only/

}
.dropdown-menu > li { display:inline; text-align: center; }
.dropdown-menu li:hover > ul { opacity: 1; visibility: visible; margin: 0; }
.dropdown-menu a { display: inline; text-align: center; position: relative; font-family: 'MyWebFont';}
.dropdown-menu ul ul { top: 0; left: 100%;}
.dropdown-menu > li ul { min-width: 150px }
.dropdown-menu ul ul li { width: 100% }

/* position arrows */
.nav-menu .icon-angle-down { position: absolute; right: 13px; top: 50%; font-size: 12px; margin-top: -6px; }
.nav-menu .icon-angle-right { position: absolute; right: 20px; top: 50%; font-size: 12px; margin-top: -6px; }
/*styling*/
.nav-toggle { display: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none;

-moz-user-select: none; -ms-user-select: none; user-select: none; }
#navbar {background: #E4DDC8; border-bottom: 2px solid #FFF; border-top: 2px solid #FFF; position: relative;

margin-bottom: 10px; }

.nav-menu { border-right: 0px solid rgba(0,0,0,1);

}
.nav-menu a { font-size: 20px; height: 50px; line-height: 50px; color:#000; padding: 0 8px; text-decoration: none;

font-weight: 700; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
.nav-menu li { float: none; display:inline-block; }
.nav-menu li.dropdown a { padding-right: 30px }
.nav-menu > li > a {border-right: 0px solid #000; border-left: 0px solid rgba(0,0,0,1); margin-top: 5px; margin-bottom:5px;}
.nav-menu > li:first-child { border-left: none }
.nav-menu li:first-child > a, .dropdown-menu li:first-child > a:hover { border-left: none }
.nav-menu > li > a:hover, .nav-menu > .current-menu-item > a, .navigation .current-menu-parent > a, .navigation

.current-menu-parent > a:hover, .nav-menu > .current-menu-item > a:hover { color: #000; background: #E4DDC8;}

/*drop-down styles*/
.nav-menu ul { margin: 0; background-color: #E4DDC8; width: 190px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5); }
.nav-menu ul li { float: none; display: inline; border-left: none; border-right: none; margin: 0; }
.nav-menu ul li:first-child { border-top: 0 }
.nav-menu ul li:last-child { border-bottom: 0 }
.nav-menu a { display: block; position: relative; text-align: center; }
.nav-menu .sub-menu li.current_page_item > a { color: #fff; background-color: #E4DDC8; }
.nav-menu ul a { display: block; padding: 10px; }
.nav-menu ul li { border-bottom: 0px solid rgba(255,255,255, 0.1); border-top: 0px solid rgba(0,0,0,1); }
.nav-menu ul a { color: #000; padding: 17px 15px; height: auto; text-align:left; margin: 0px; border: 0px; line-height:

1em; font-size: 25px; text-shadow: none; }
.nav-menu ul li > a:hover { color: #000; background-color: #E4DDC8; background-image: none; border-color: transparent; }
/*nav icons*/
.nav-menu li[class^="icon-"], .nav-menu li[class*=" icon-"] { font-family: font-family: "Big Caslon", "Book Antiqua", "Palatino

Linotype", Georgia, serif;} .nav-menu li[class^="icon-"] > a, .nav-menu li[class*=" icon-"] > a { padding-left: 40px } .nav-menu li[class^="icon-"]:before, .nav-menu li[class*=" icon-"]:before { font-family: 'FontAwesome'; font-size: 14px;

line-height: 14px; height: 14px; width: 14px; text-align: center; color: #fff; position: absolute; left: 16px; top: 50%; 

margin-top: -8px; z-index: 999; }

最佳答案

在元素的类 .sub-menu 中,删除 left:0 属性。它迫使 ul 元素位于左侧。同时删除 top 100% 和 margin: 10px 0 0 0 属性。他们在这里没用。 :) 希望有帮助

关于css - 导航上的下拉框未对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23609277/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com