I am working on this page (www.guerillaroots.com) that you can look at to get a better idea of what i am talking about. I want to move all those links on the left side of the header to right underneath the brown part of the header where the light and dark green is. Instead of having all the links stcked on top of each other I would like them to be spaced side by side. If you know how to do this and can walk me through it I would appreciate it very much. Thanks :)

Comments

mpare’s picture

One possible way would be absolutely position #header ul 325px from top. And make #header ul li to display inline. I don't know what kind of styling you want. I think the better way would be to keep the links in the flow of the document sandwitched at the end of your header so that the links would expand with the rest of the page if you ever emplemented elastic capabilities to your site, as it stands now its static so not a big deal. Your code for the first option may look like...

#header ul { /* style.css (line 63) */
  background:#CEBC7D none repeat scroll 0%;
  color:#C5B16B;
  margin:0pt;
  padding:0px;
  position:absolute;
  top:325px;
}

#header li { /* style.css (line 73) */
  display:inline;
  list-style-type:none;
  padding:0pt;
  text-align:left;
  width:136px;
}

Peace,
-mpare
--
Pare Technologies
Drupal Consulting, Themeing, and Module Development
806.781.8324 | 806.733.3025
www.paretech.com

Figure Something Out? Document Your Success!

pbarnett’s picture

...so there's not really a general solution to the problem. I'd personally approach it by moving the Primary Links menu into a new region and then styling it with the tabs inline.

Not a trivial piece of work, though... I'm sending you a modified version of the theme to get you started via email; I spent about an hour on it to get this far!

Pete.