Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

Making the menu bar full width (but header and content both smaller)


  #1  
Old Dec 15, 2013, 11:57 PM
mrsp31wannabe
 
53 posts · May 2011
Is there any way I can configure the menu bar to span the entire width of the browser, setting a specific height for it as well, but maintaining my header and content to be smaller?

I'm looking for something like this: (not Atahualpa theme) for the menu bar.
  #2  
Old Dec 16, 2013, 06:25 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
In 3.7.13 you have the option of making the header full width. Do that then center the header images and menu.
__________________
"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 17, 2013, 09:08 PM
mrsp31wannabe
 
53 posts · May 2011
Ah, yes I missed this new change. BUT when I make the header full width and center the menu bar, the grey background of the menu bar only goes as wide as the button items. I want the grey background bar to go full width as well. Can I do that? Also, can I change the height of it, so that it looks like a bar rather than a highlight under the categories?
  #4  
Old Dec 18, 2013, 04:33 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
what is the URL?
go to ATO->Export/Import copy the export settings to a TEXT file and save it to an attachment in your reply (use the paper clip icon)
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Dec 18, 2013, 10:53 AM
lmilesw's Avatar
lmilesw
 
10,174 posts · Jul 2009
Central New York State USA
You could set the width to the imagecontainer (and other elements as desired and center with CSS (margin: 0 auto
__________________
~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.
  #6  
Old Dec 18, 2013, 11:46 AM
mrsp31wannabe
 
53 posts · May 2011
url: http://teachingwhatisgood.com

Here's the text file. Now I switched it back to "normal" until I figure out what to do.
Attached Files
File Type: txt ata-teachingwhatisgoodcom-20131218.txt (20.7 KB, 473 views)
  #7  
Old Dec 18, 2013, 08:45 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
The example site you show has the background across the page. On your site you have a background and then the contents area is a different style altogether, so I'm not sure what you are trying to end up with.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #8  
Old Feb 16, 2014, 06:43 PM
SharonJ's Avatar
SharonJ
 
639 posts · Sep 2010
Duncan BC Canada
I do this all the time using an image that is 1 px wide and in this case about 329px high

Here is my css

body{
background-image: url("http://yoursite.com/background.jpg");
background-repeat:repeat-x;
background-position:top;
background-attachment:fixed;
}

The first skinny one multiplied many times will give the impression of a block of color

#1 makes it look as if the menu goes right across, but it is an image repeated many times.
Code:
 
  #9  
Old Feb 25, 2014, 05:01 PM
runnerb0y
 
67 posts · Nov 2010
SharonJ;

Good 'trick', I always forget about building a small (skinny 1px) graphic then have it repeat. Nice reminder. Thanks!
  #10  
Old Feb 25, 2014, 07:19 PM
SharonJ's Avatar
SharonJ
 
639 posts · Sep 2010
Duncan BC Canada
You are welcome!
  #11  
Old Feb 25, 2014, 08:00 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
You can set the background color for a centered menu with CSS.

Say you set your header for full width AND use %page-center to set the background color of the menu to be full width just add to the CSS Inserts
HTML Code:
#bfa_page_menu {background-color: #rrggbb;}
where you replace rrggbb with the color you want.
__________________
"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
I want a full width header, fixed width content and a background image tsheridan Header configuration & styling 5 Jan 29, 2013 03:46 PM
Full-width header, narrower content area? paulae Header configuration & styling 26 Nov 14, 2012 04:51 PM
[SOLVED] How to make header and page menu bar full width and take the white spacing o amy17 Forum How-To 9 Apr 9, 2011 08:13 PM
[SOLVED] Full width footer with widgets but narrower content netrdx Header configuration & styling 4 Nov 12, 2010 04:08 PM
How to make header image & menu bars stretch full width of the container? Shan_LSOS Header configuration & styling 19 Oct 26, 2010 12:51 AM


All times are GMT -6. The time now is 10:00 PM.


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