ThemeShaper Forums

Help In Shaping WordPress Themes

Register or log in:

Username:
Password:

Remember me

ThemeShaper Forums » Thematic

1. 

   JLocke
   Member

   Hello everyone, just want to say this forum is an awesome place and building with thematic is great... except for this one problem I've been having:

   http://islanders.jesselocke.me/

   I 'm trying to line the nav bar up with the edges on #main and center the page links. I can kind of do this already, however, the way I'm doing it the nav bar moves when you re-size the browser. Obviously not a good thing.

   #access {
   float:none;
   height: 33px;
   border: none;
   width: 960px;
   left: 244px;
   background-color:#330000;
   }

   .sf-menu{
   position:absolute;
   left:40%;
   margin-left:-25%;
   background-color:#330000;
   }

   Please help, this has been killing me.

   I think its just some positioning problem, but I've exhausted my knowledge.

   Thanks very very very much

   Posted 3 years ago #
2. 

   MarSOnEarth
   Member

   Because the containing block of #access is (ultimately) html, which has a width of the canvas, if you set the width on #access you also have to center it. This will be accomplished with:
   

   margin:0 auto;
   width:960px;

   BUT take out that left: 12px from the #main

   Posted 3 years ago #
3. 

   JLocke
   Member

   Awesome man, that worked like a charm

   Here's the code I used to center the top nav.
   *note, I added {left: 12px;} because I has to make #main a little wider to fit with the header image.

   #access {
   margin:0 auto;
   width:960px;
   float:none;
   height: 33px;
   border: none;
   left: 12px;
   background-color:#330000;
   }

   .sf-menu{
   position:absolute;
   left:40%;
   margin-left:-25%;
   background-color:#330000;
   }

   Just gonna leave this hear in case anyone else is looking for something like this.

   Thanks MarSonEarth, you cured my headache

   Posted 3 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.