Forums / Templates, Stylesheets, Page Layout / Move Top Menu Links to the Right

Move Top Menu Links to the Right

Results 1 to 5 of 5
11 Jun 2010, 19:28
#1
carol2848 avatar

carol2848

New Zenner

Join Date:
Nov 2007
Posts:
78
Plugin Contributions:
0

Move Top Menu Links to the Right

I plan to remove my Header Search Bar, and put the top menu links (above the Logo Wrapper) in its place on the Right side of the page. I figured out how to remove the Search, but can't find how to move the links. Thanks for any help!
11 Jun 2010, 20:16
#2
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Posts:
19,793
Plugin Contributions:
2

Re: Move Top Menu Links to the Right

In the stylesheet, add float:right; to #navMain ul
11 Jun 2010, 21:51
#3
carol2848 avatar

carol2848

New Zenner

Join Date:
Nov 2007
Posts:
78
Plugin Contributions:
0

Re: Move Top Menu Links to the Right

THANK YOU! This worked perfectly in my sandbox site. Will update my actual store soon.
18 May 2011, 20:56
#4
art75 avatar

art75

New Zenner

Join Date:
Aug 2010
Posts:
12
Plugin Contributions:
0

Re: Move Top Menu Links to the Right

stevesh:

In the stylesheet, add float:right; to #navMain ul


Stevesh

I have #navMain ul in 3 or 4 places in my stylesheet.css (folder: /includes/templates/template100003/css )

Should I change that in every place ?

Regards
Artur
12 Jun 2011, 19:59
#5
art75 avatar

art75

New Zenner

Join Date:
Aug 2010
Posts:
12
Plugin Contributions:
0

Re: Move Top Menu Links to the Right

Me again - need your help :)

I can't justify this menu - "Home | Log in | Shopping Cart | .... " to the right

My tpl_header.php does not contain <div id="navMain"> (in the other thread User Cobra suggested changing this "back" to "forward" ). My tpl_header includes only:

<div class="header-link">
<div class="moduletable_menu">
<ul class="menu">
.... and the rest of code regarding menu

So I am not sure if changing anything "about navMain ul" would help. In my css - I have:

.header-link{ float:right; padding:43px 11px 0 0;}
.header-link ul{ list-style:none; margin:0; padding:4px 0 0 0; overflow:hidden;}
.header-link ul li{ display:block; float:right; background:url(../images/header_separator.gif) left 7px no-repeat; margin:0 0 0 -1px;}
.header-link ul li a{ color:#868585; font-size:11px; line-height:14px; text-transform:uppercase; padding:0 16px;
text-decoration:none;}
.header-link ul li a:hover{ color:#920007; text-decoration:none;}

Yet I have no idea where to put this "float: rght;" to make it work.
I tried in the most places.

Anyone ?