Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

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

[SOLVED] Custom Top level menu size + span the menu accross the width of the page


  #1  
Old Dec 9, 2011, 12:08 AM
muthukumarp
 
7 posts · Dec 2011
Unhappy [SOLVED] Custom Top level menu size + span the menu accross the width of the page

First, I'd like to thank you for the wonderful theme! This theme is the most customizable theme that I've ever tried till date. And the support from developers is awesome!

Now, trying to customize my site, I'm running into small issues (rather my requirement). I'd like my menu to have a custom width. i.e., menu size not adjustable based on the links inside, but a menu that would span accross the width of my page. Something like the one below:



Searched around the forums and couldn't find anything that helpful.

I'm trying to figure out which file that I would need to edit and which line, but with no joy. I'm not a programmer or a developer by nature/profession and that leaves me unarmed. Hope someone here can help me!
  #2  
Old Dec 9, 2011, 04:35 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
add the following to CSS Insets - make sure to chang the width to what you want
HTML Code:
div#menu1 ul.rMenu li {width:100px;}
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Dec 9, 2011, 07:23 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
You can also divide 100 by the number of tabs and start with that as a percentage. For instance if you had 5 tabs you would start with
HTML Code:
div#menu1 ul.rMenu li {width:20%;}
Depending on margins and such this will probably wrap the menu to two lines.
Then I start reducing the width to 19%, 18%, etc until it doesn't wrap.
Then I add up to three decimal places to the width starting with the width that didn't wrap.
So If the menu stopped wrapping at 18% but didn't fill the full width I would try.
18.1%, 18.2%, etc. until it wrapped again and then back off.
So what you might end up with after all this is
HTML Code:
div#menu1 ul.rMenu li {width:18.456%;}
Which will give you a menu that fills the whole width and each tab is the same size. You might also want to center align the text so the final code might be.
HTML Code:
div#menu1 ul.rMenu li {width:18.456%;text-align:center;}
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #4  
Old Dec 9, 2011, 08:48 AM
muthukumarp
 
7 posts · Dec 2011
Thanks both!

Is there any specific file that I should be looking at? (for I have about 3 different files that has the word CSS on them). And should I replace any line?
  #5  
Old Dec 9, 2011, 10:42 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
In the theme options - no need to change any code (gotta love this) Add HTML/CSS Inserts
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #6  
Old Dec 9, 2011, 10:48 AM
muthukumarp
 
7 posts · Dec 2011
Wow... that did the magic! Thanks both!

I'm also trying to get the menu displayed below the header image. Let me look around a bit before I post another question!

Bookmarks

Tags
custom width, full page, menu

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] left sidebar, gray block from 1st level appears in front of 2nd level menu i teckerman Sidebars & Widgets 6 Aug 15, 2011 05:37 PM
[SOLVED] Would like horizontal menu to span page body (example inside) BackyardHockey Page & Category Menu Bars 6 Oct 25, 2010 10:10 AM
[SOLVED] Unable to re-size width of my Page Menu sub menus with 353 Zabaan New Versions, & Updating 9 Oct 19, 2010 10:12 AM
How to make header image not span full width of the page zachmorton Header configuration & styling 1 Sep 29, 2010 04:16 PM
Top Level Menu highlight when sub-menu page is displaying? brianlees Page & Category Menu Bars 0 Jan 18, 2010 03:38 PM


All times are GMT -6. The time now is 08:54 AM.


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