PDA

View Full Version : 3.8 Navbar Customize Help


kNeeLy
06-07-2011, 06:34 PM
ok...i've tried everything under the sun...but can't get it right. What I would like, is for my navbar to be (with a space) right under my header logo.

Wayne Luke helped me before, as I know I have to take the navbar code and move it to the header section, but when I do that, the navbar streches all the way across the screen. I would like to make a fixed width. My logo is 850 wide. I would like my forum and navbar all to line up with it.

If I post my code, can someone PLEASE fix it/help/make it work?? lol...

BirdOPrey5
06-08-2011, 12:44 AM
Are yo saying you want everything on your page to be 850px wide?

A screen shot or something might help.

kNeeLy
06-08-2011, 12:53 AM
Are yo saying you want everything on your page to be 850px wide?

A screen shot or something might help.

yes, basically.

I want my navbar below my header logo, which I did before, but can't remember how to do it. Like I said, Wayne did the code for me, and there was something in there that I had to "tweek" so the background of the navbar didn't stretch across the whole page....

In a nutshell, I would like to make a "fixed width" skin, at 850 pixels and have the navbar, forum, ect., line up under it.

I'll try and cut a screen shot...

BirdOPrey5
06-08-2011, 01:02 AM
In All Style Options for your style the box Main Table Width (pixels or percentage)

Change it from 100% or whatever it is to just a fixed number, like 800. This will make the style fixed-width.

kNeeLy
06-08-2011, 01:01 PM
In All Style Options for your style the box Main Table Width (pixels or percentage)

Change it from 100% or whatever it is to just a fixed number, like 800. This will make the style fixed-width.

That part works.

But.

When I move the navbar code into the header, it moves the navbar under the logo, which works cool..but..the 'background color' of the navbar stretch's all the way across the page, while the actual navbar buttons stay lined up.

Lemme try and re-produce it real quick and show...

kNeeLy
06-08-2011, 01:35 PM
Here's what it looks like when the <!-- nav buttons bar --> code is moved to under the header logo.

All I want, is a little "space" in between the logo and navbar, and for the navbar to line up with the rest of the forum, not even the logo...

BirdOPrey5
06-08-2011, 02:58 PM
I gotcha...

Try surrounding the <!-- nav buttons bar--> code (all of it) within the following:


<div align="center" style="width:850px;">

NAV BUTTON CODE HERE

</div>


That should center the menu under the header logo.

If you want some more space add a <br /> above the <div> line for an extra blank line.

kNeeLy
06-08-2011, 03:14 PM
SOOOO close!!!! lol

It lined it up, but it's all the way against the left side of the page...now it just needs centered!! lol...

BirdOPrey5
06-08-2011, 03:34 PM
weird... try this:

<div align="center" style="width:850px; margin-left:auto; margin-right:auto;">

kNeeLy
06-08-2011, 03:51 PM
IT WORKED!!!! HA!!!!!!

Thank you....it's a hair off on the left side, but i'm not worried about that!!

Thank you...for all the help...thank you!!

BirdOPrey5
06-08-2011, 08:55 PM
You can use some more advanced CSS if you look it up to try and perfect it- it's hard to do without access to the live site. My guess it will look better on some browsers than others.

If you want there is one more option to try, not sure if it will look any different at all:

<div align="center" width="850">

kNeeLy
06-10-2011, 12:45 AM
Very cool.

Do you happen to know how to take the lines out in between the links. (Home, Forums, User CP, ect.)?

I know I'm a pain in the a55....I really thank you for doing the code!

BirdOPrey5
06-10-2011, 11:45 AM
Not off hand. I'm sure it's part of the CSS for the "class" used in the table or cells.

If you use Google Chrome you can right click on one of the boxes and choose "Inspect Element" and it will show you all the HTML/CSS involved in giving that object its properties. It's probably a border element that you can remove somewhere in the CSS.