我需要一些帮助。在#34; gallery"下的导航菜单上的下拉菜单没有在单词库下对齐看到live site:lofthairstudio.ie。
任何人都可以看到我出错的地方 - 我希望画廊的下拉内容显示在菜单上的字库下,而不是它的样式。
提前谢谢 gus/* 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;上:100%;左:0; z-index:99;不透明度:0; 能见度:隐藏;过渡:所有.2s轻松进出;保证金:10px 0 0 0; _margin:0; / 仅限IE6 /
} .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 - "]:{font-family:' FontAwesome&#39 ;; 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; }
答案 0 :(得分:1)
在您的类.sub-menu for element中,删除left:0属性。它迫使ul元素向左侧。同时删除前100%和边距:10px 0 0 0属性。他们在这里毫无用处。 :)希望有所帮助