Centering menu only

tiankheesiong / 2013-02-26 19:08:28   

Hello,

I'm having trouble working out how to center my menu and pre-nav area so that when you resize the browser it will always stay centered or move with the size of the browser. Here is the site:

gm.kheesiong.com

I like the way the content is right now so I tried to copy what I did on #content to #menu and #top-section but it doesn't work. I searched the forum and even tried on the php file and added this to my style sheet (which I got from centered theme):

#wrapper {
width : 800px; /* sets the widh of the website content */
margin : 0 auto; /* do not modify */
text-align : left;
text-align : justify;

But it does not work either. I think I'm doing something really wrong, can anyone advice?

Many thanks

lemathieu A / 2013-02-27 10:22:49   

hello,
in fact, you should wrap all your site in a centered div.

add this just after the opening "body"

  1. < div id='wrapper' >

and close it just before the closing "/body".

After, style that div the way you want, e.g.

  1. #wrapper { width : 850px; /* sets the widh of the website content */
  2. margin : 0 auto; /* do not modify */
  3. text-align : center;  }
tiankheesiong / 2013-02-27 20:45:44   

Thanks lemathieu, the centering works well with the content but it still doesn't center the menu and pre-nav.

I managed to 'center' (a little off on the right...) of the menu title 'Grampian Mountains' but I can't seem to align pre-nav details below the menu:

gm.kheesiong.com

And also, to center the content (after clicking on the images) which part of the CSS do I style to center them?

gm.kheesiong.com/…

lemathieu A / 2013-02-28 08:33:10   

Hello,
you didn't style the #wrapper in your css.
btw, you shouldn't start with my columner theme, it's not the easiest to center.

tiankheesiong / 2013-03-06 23:31:45   

I did try the wrapper but its not the centering style I am after. I wanted the site to feel fluid i.e. when the browser screen is adjusted the images move to the size - no bar scroll...

Now I know what you mean. Its really hard getting the menu and content to center together. I tried adjusting it by using the margin but it is never aligned to the text in the content, like so:

gm.kheesiong.com/…

Unless the screen is around 17inch. but when its smaller or larger than that its not centered. But do you have any other tips about from using wrapper? Do you suggesting starting from default indexhibit legacy and work it out by moving the menu from left to top, then center?

Thanks again.

tiankheesiong / 2013-03-07 00:44:59   

I just re-read my question to you and it needs some re-wording:

Unless the screen is around 17inch, when its smaller or larger than that its not centered. Do you have any other tips apart from using wrapper? Do you suggest starting from default indexhibit legacy and work it out by moving the menu from left to top, then center?

Sorry about that, my brain needs rest.

This thread has been closed, thank you.