How to Change the HELP Link in the Header into a Drop-Down Menu for Non-Users???

[NashChristian]

Originally Posted by NashChristian

Thanks Lynne, that worked!

I still can't figure out how vB is styling the line... I can for the NavTabs, but I can't for the header links. The only styling I'm aware of for the global header links with a drop-down menu is for the <li class="popupmenu nonotifications"> which works fine for the Logged-In users without tweaking, but doesn't work for the Logged-Out users.

I've been testing this in Firefox with the Firebug plugin, and had been logged into my AdminCP in IE while testing, so I just now saw how this looks in IE when Logged-Out, and there is an extremely noticeable problem in IE8:



For some reason IE is displaying a large gray block below each list item. I have specified no padding and no margin. This isn't displaying in the other browsers, and this doesn't display in IE when Logged-In either. I don't know what is causing this to display in IE when Logged-Out. I'm not even sure how to proceed with debugging it, since it is only visible in IE. I tried using the IE developer tools, but that didn't seem very intuitive.

Here is the code I'm currently using:

.toplinks ul.nouser a.popupctrl, .toplinks ul.nouser a.popupctrl:hover, .toplinks ul.nouser a.popupctrl:active {
background: {vb:stylevar navbar_tab_background.backgroundColor} url("images/misc/arrow.png") no-repeat scroll right center;
padding-right: 15px;
padding-left: 4px;
}

.toplinks ul.nouser li.popup a {
    -moz-border-radius-bottomleft:0;
    -moz-border-radius-bottomright:0;
    background:none repeat scroll 0 0 #FFFFFF;
    border-top: 1px outset;
    clear:none;
    color:#000000;
    float:none;
    line-height:26px;
    height:26px;
    font-size:11px;
    margin:0;
    padding:0 5px;
    text-align:left;
}

.toplinks ul.nouser li.popup:first-child a {
    border-top:0;
}

.toplinks ul.nouser li.popup a:hover {
    background:{vb:stylevar imodhilite_backgroundColor};
    color: {vb:stylevar navbar_selected_popup_body_a_Color};
    text-decoration: underline;
}

I realized that you can't compare the Logged-In versus the Logged-Out versions without registering a user name, so I setup a temporary test account so you can Log-In:

WEBSITE
Username: Test
Password: 123456

Please take a look at it and let me know what you think is going on here.

Thanks for all the help!
Jeff

I spent a FULL day working on this today and STILL can't figure it out!

I've tried Firebug for IE, and it doesn't even allow you to select the element with the gray block. I've tried using a negative bottom margin:

.toplinks ul.nouser li.popupmenu ul.popupbody li.popup a{
	margin-bottom: -13px;
}

Which ALMOST works in IE... it pulls out the gray block, however, it sucks up the bottom border of the list so that it's actually behind the list itself. The other problem with this method is it screws up the display in every other browser. I've tried adding the code to the replacement-vbulletin-ie.css or the vbulletin-ie.css, so it will only run the code if the browser is IE, however I can't get that to work for some reason.

I don't get it!
At this point, I don't care if this is styled exactly the same as the other navbar drop-down menus (with a 1px border all the way around), but I can't even get that to work correctly. Apparently the css is designed for those only to work in the navbar, not the header.

I'm about to pull my hair out. Does anyone have a suggestion about how to get this to work and display correctly???
Thanks...