Mon, 2013-01-14 06:29
ok, so i honestly don't know what i'm doing with drop down menus. i somehow just can't figure out how to do it right.
but just from messing around i got pretty close to what i want. only issue is the sub menu drops down in a fixed place on the far left of the menu rather then directly under its respective tab
please help me!
for the html, the website it www.ucchicago.org
here is the css...
#nav{ width: 100%; display: inline-block; text-align: right; float: right; margin: 0; padding: 0; } #nav ul { position: absolute; left: 22%; top: 28%; } #nav ul ul{ display: none; } #nav ul li{ display: inline-block; height: 62px; } #nav ul li a{ padding: 15px; background: orange; color: white; border: solid; } #nav ul li a:hover{ text-decoration: none; background-color: #ffb424; box-shadow: 0px 4px 5px #666; } #nav ul li ul { display: none; position: fixed; padding: 0px; margin-left: auto; margin-right: auto; } #nav ul li ul li a { padding: 10px; display: inline-block; background: #688A08; color: white; } #nav ul li:hover ul { display: inline-block; } #nav ul li:hover li { display: inline-block; }
//mod edit: When posting a link, you must include the transfer protocol in the url, i.e. "http://". Else, it's treated as a relative url and the browser will try to find it on the CSSC site. Fixed ~gt