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 »

[SOLVED] Full width header with fixed width image and background color

Old Jun 8, 2011, 11:56 PM
3 posts · Jun 2011
First of all, hello all and thanks for helping through this website. I am currently volunteering in Cambodia and since i have done some print design, my boss apparently thinks me qualified to manage our website at www.bsda-cambodia.org. Having almost no prior experience, i taught myself a couple of usefull things, but am not able to solve the issue implied in the title. What i basically want is a header layout similar to the one on www.hypem.com, with a picture and a background color of the same height that adjusts itself to the browser width. I have looked for this online but apparently havn't found the right combination of words :-). All help is greatly appreciated.
Old Jun 9, 2011, 01:53 AM
LANtait's Avatar
56 posts · Jan 2011
Cebu Island, Philippines ~ I live on a tropical island!
I don't know if this is what you want, but for me, I found that if I wanted to float or self adjust to the with of the window, I needed an image that was larger than the largest window that I wanted to support. It seemed (and I am open to correction) that a too large image would shrink to the smaller size ok, but a too small image would only go to its own size and not stretch at all.

At least that is the way it seems to work in the Philippines!

As far as putting a smaller image on top of a bar of color. That should not be a problem I think (I have not tried this yet) because the smaller image will not enlarge.

I think...

Do you have a test site in the back of a local computer, it can be very valuable to test these kind of things...

Old Jun 9, 2011, 02:07 AM
3 posts · Jun 2011
No, i don't have a test site, but that is probably another thing i should learn :-). Would it be as easy as somehow making an offline server and then copying everything i have on the website on there or is it more comlicated? The streched image wasn't really what i was going for, but thanks nevertheless, I will fall back on it if this doesn't work. As for the small picture + bar of color thing, could you point me in a direction of how to 1. create the bar and 2. stack them? would that be a css insert thing or is it achievable with atahualpa options? as i said, i am very new to this
Old Jun 9, 2011, 02:39 AM
LANtait's Avatar
56 posts · Jan 2011
Cebu Island, Philippines ~ I live on a tropical island!
I use Ubuntu on my personal Computer that has a LAMP program running in it. LAMP is Linux, Apache, MySQL and PhpMyAdmin. It is sorta like having a personal web server inside of your computer. For me it works identical to my servers configured around the world that I work on. No need for a special server.

I have a friend who does it the same with his desktop version of FreeBSD and I am assuming MicroSoft has some version for windows also but that is beyond what I can help you with.

I have a copy of my server that I can make tests on, and if I crash the whole thing... ok, start over with my last good result. It also makes a nice offline backup copy... of sorts.

As to what you asked...

HTML Code:
<div id="imagecontainer" class="header-image-container" ...
This appears to be the background of where your header image is. You could add some css as to the background color attached to this id.

Something like:

HTML Code:
#imagecontainer { background-color: #FF0000; }
This might give you as start...
Old Jun 10, 2011, 03:13 AM
3 posts · Jun 2011
Perfect, seems to work on my labourously set up offline server thingy. Another option i just thought of would be to just set an appropriate background picture for the entire site.Thanks a lot, I really appreciate the quick and precise help. Enjoy your island


background, full width, header image

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
Thread Thread Starter Forum Replies Last Post
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
How to make header image not span full width of the page zachmorton Header configuration & styling 1 Sep 29, 2010 05:16 PM
[SOLVED] How to have a full-screen bottom bar with fixed-width website FineDesigns Header configuration & styling 1 Jul 7, 2010 02:15 PM
How do I changed the fixed width for my header? rsaelee Header configuration & styling 1 Jun 17, 2010 06:16 AM
Fixed width site. Different page background color from body color? blueprairie Forum How-To 1 Mar 20, 2009 09:55 PM

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

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