Submenu Restyling

[Drae]

Is it possible to do the following?

• Change Forum, Members & Help to hover one under the other, above/on top of the header, with pop-ups appearing on the right hand side?
• Same again for Username, Inbox & Alert but for their pop-ups to appear on the left hand side?

And how do I code it as I've tried before and failed XD

 

[Shelley]

Unsure what you mean but i'll give it a shot.

add the following to extra.csstemplate though you may not have to use !important in the code try it without and if it needs to be in then insert it back.

.navTabs .visitorTabs {
    float: left !important;
}
.navTabs .publicTabs {
    float: right !important;
}

 

[Shelley]

TBH the whole thing looks odd. I'm sure I misunderstood what your asking for but i ventured to my test site and move the tablinks over to the right but still having trouble moving the search to the left which I've done before but having trouble moving it.

 

[EQnoble]

Like this?

 

[MagnusB]

Are you talking about a vertical menu instead of an horizontal one? In all honesty, it might be more work than it is worth, but you basically achieve this by removing float: left from .navTabs .navTab

 

[Shelley]

Are you talking about a vertical menu instead of an horizontal one? In all honesty, it might be more work than it is worth, but you basically achieve this by removing float: left from .navTabs .navTab

I think it might be worth it. But not have them vertically stacked in the header but attached to the left hand side of pageContent, mainContainer perhaps as tabs. I've seen a couple of styles with this layout and it looks alright. Perhaps the OP means like below vertical layout? I'm still not sure what the request is though.

 

[MagnusB]

Moving it to the side is feasible, but I would imagine it would be some work getting it there.

 

[Drae]

Thanks guys for your replies! Been distracted by work but I'm back on it now.

Yes, vertically, both how EQnoble and Shelly have displayed. I'd like to know how to do it both ways as I'm still playing around with the layout, but I do know for definite that it will be a vertical display.

My navigation css is currently pretty similar to the default XF skin (I tried to add it in but I was told I hit the character limit so I couldn't post it up).

Thanks for your help so far guys!

If it helps: essentially what has happened with this design is that I had an artist do some custom art for its header, depicting one of the more recent events in my forum's game. It included a tower and unfortunately he made the art to 1000px instead of 2000px so I'm having to try and figure out how to utilise the space on the artwork's (aka header/logo) space as the board itself needs to be 1000px wide to support our netbook users. I may end up cropping the art though it'll lose some of its 'pow' effect, but vertical menus will definitely be used in this skin either way.

 

[Drae]

Any chance of some help with this? Particularly with how to so it in the example Shelly found?

 

[Drae]

Still looking for help with the above.