Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Page & Category Menu Bars »

Page menu bar buttons the same flexible width like fluid layout


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Feb 7, 2009, 09:28 AM
Tigger
 
35 posts · Feb 2009
Page menu bar buttons the same flexible width like fluid layout

Hi Flynn,

I centered the page menue bar. I pasted the code into the php file like described in Thread http://forum.bytesforall.com/showthread.php?t=122 . As your posted code text is a bit wider than the screen, you have to scroll to copy it all from the thread. And that creates a bug when you paste it into your php. When copying, it is missing a bit of the code which should be pasted into line 12 !!!

<div class="clearfix rMenu-center">

Just for everybody else to know, that you manually have to add this piece of code afterwards by hand typing.

I have now the page menu bar with few buttons hanging in the middle. Is it possible, to make these buttons expand to the whole screen width ? Like that, I would have a full navigatin bar and not just few buttons hanging in the center. Every button would get the same width, automatically (fluid) changing with the bowser width.

One more comment: When you delete the home button from the page menue bar by leaving the field blank in the theme options, wp is still displaying this generated button field for "home". As this button field is empty, it just gets a width of 0 and is not visible. But in fact, the dashed line of the field is visible. The result is, that you have 2 dashed lines at the very left side of your page navigation menue (sort of a double line). How can I delete one of them ?

By watching few users pages I could see, that this problem appears on many userīs pages. It is just not easy to notice, as it is just a small 1px line at the left side of the navigation bar.
  #2  
Old Feb 7, 2009, 12:13 PM
Flynn's Avatar
Flynn
 
3,765 posts · Oct 2008
Munich, Germany
You're right about the two borders on the left, but they're not caused by an empty <li>...</li> for a "Home" tab that was turned off, but by the left border of the menu bar plus the left border of the first menu tab on the left. The menu bar's left border can be turned off with

HTML Code:
ul.rMenu {
border-left: none;
}
Thank you for noticing that, I'll add it to 3.2.1

Or are you seeing an empty <li>..</li> in the source code in your browser?

================

Re: Centering Page Menu Bar http://forum.bytesforall.com/showthread.php?t=122

At first I could not replicate your copy / paste problem. I could easily copy every line including the long one, be it by highlighting it with the mouse or by clicking into the code area and pressing Ctrl+A. That was with Firefox. Then I tried IE7 and bummer... you're right. I broke that into two lines now and added a notice to that thread plus a sticky thread about the general IE7/single scrollbar code line copy problem. Thank you for noticing that as well.

================

Re: Menu tabs whole width: That would be a bit troublesome I think, to bring that in line with all browsers. At least with the "expanding to whole width" part. You should however be able to give them more width (all the same) with a CSS Insert such as

HTML Code:
ul.rMenu-hor li {
width: 15em;
}
To center the text inside add

HTML Code:
text-align: center;
  #3  
Old Feb 7, 2009, 05:04 PM
Tigger
 
35 posts · Feb 2009
Hi Flynn,
I pasted the code into CSS Field to remove left border of page menu bar. But nothing happened. Above I had the code for centering the page menu bar already inserted. So I mixed them together. The result is working:

ul#rmenu2 {
border: 0;
}
div.rMenu-center {
border: dashed 1px #ccc;
border-left: none;
}
  #4  
Old Nov 12, 2009, 06:42 AM
hospitalera
 
72 posts · Mar 2009
Prague
I would love to get such a fluid width page menu working for my new site, I am using Atahualpa 3.4.4 with it. Any ideas if it is possible, I have my page menu already centered, but it looks a bit "untidy" as it doesn't stretch for the whole layout. Thanks for your help, SY
__________________
Hospitalera's Blog
  #5  
Old Apr 7, 2010, 04:42 PM
jtsharp
 
23 posts · Mar 2010
A bump for this topic - have there been any updates allowing for a fluid width page menu? I'd love to have my links stretched evenly across the entire page rather than compactly centered in the middle. Here's the url: http://www.drjeremysharp.com. Thoughts?
  #6  
Old Apr 8, 2010, 07:43 AM
juggledad's Avatar
juggledad
 
22,244 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
A far as I am aware, there hasn't been any change to this area.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Creating buttons for the page menu Nourdmrolnmt1 Page & Category Menu Bars 5 Feb 2, 2012 01:03 PM
Another page menue bar with expanding and collapsing buttons Tigger Page & Category Menu Bars 4 Nov 6, 2009 07:17 AM
[SOLVED] Layout WIDTH vs. Layout Container Olivier Header configuration & styling 2 Jul 13, 2009 06:18 PM
how to extend the added image to your layout width in menu bars? and some other Q's ppat2 Page & Category Menu Bars 1 May 5, 2009 05:28 PM
[SOLVED] Howto: Align page menu bar with left sidebar or opacity overlay width iroQuai Page & Category Menu Bars 1 Mar 7, 2009 05:01 PM


All times are GMT -6. The time now is 07:34 AM.


Powered by vBulletin® Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.