I'm Back! Need help with a website header

There isn't a specific code that does what you want. What you need to do is design your site with % widths, not specific pixel sizes. Your header image will, of course, be a set dimension (the header for the site you referenced is 450px), and the outer dimensions of the page will be dynamic.

The blue gradient is a a very narrow image (2x150px) set to repeat across the top of the page so it will fill the entire width of the browser window. If you make your browser narrower than 900px though you'll see that the left/right scroll bar appears because the content table is set at 900px.

Put this in the head of your page:

<style type="text/css">
body {
background-image: url(images/bkg.gif);
background-repeat: repeat-x;
}
</style>

where bkg.gif is the image of your gradient In the site you referenced this image is 2px wide and 150px long but the length is going to depend on how long your gradient is.

I put that code in there and nothing happened

+

I dont understand

Yacko - Did you create your bkg.gif image and put it in your images folder?

mr_banks - Well, I wouldn't do it this way either - I'd use css. But this seemed the easiest way to get it working for Yacko. How would you do it? I'm always eager to learn a better way to do something.

Sadly, I can't P.M

Here is my code if that will help you guys:

This is a post from another site which I posted on . Maybe that'll also help you guys

It would be, really really nice if someone could actually HELP me >_<

So what exactly is the problem at this point? What have you done? What changed when you did that?

If you're expecting your header IMAGE to expand and contract based on screen resolution, you're going to be disappointed.

What's your website? wholsaletrafficsystem dot com (as you typed it in your OP) doesn't resolve, so I went to wholesaletrafficsystem dot com/. There are no horizontal scroll bars there at 1024x768. On the other hand, the code there doesn't seem to match what you posted.

Without better info, it's going to be hard to help.

That's not my website.

I simply want my header like that! From left to right. If you read my post, maybe you'd realize.

What info do I need?

I simply want my header to go from left to right without making side scroller bars. THE CODE IS FOR MY WEBSITE.

What other info do you want, I've given you my code.

I need steps to take to get my header like wholesaletrafficsystem.com

Let's see your CSS.

And I'd suggest throttling back a little on your attitude if you want help from people

I apologize.

It would be appreciated if I read my post >_<.

Anyways, I don't have CSS, I just have made a photoshop header...

Please explain :\....

My website is...

www.qwikweightloss.com/pooga/challange.html

Your header and page is 1280px wide - there's going to be left/right scroll bars for everyone with their resolution set lower than 1280x768.

Okay. I know that.

But at wholesaletrafficsystem.com - They have their header adjust from left to right with no side scrollers. (no matter what the resolution etc.)

The question is how do I get it like that.

Is there a code?
Is there some special trick?
What are the steps I need to take in order to get my website like that?

Surely it can't be that hard if everybody is doing it.

As I've said, if you view wholesaletrafficsystem.com at all resolutions, their header appears identically.

I'm asking HOW do they do that. I really don't mean to offend but not one person has answered my question properly

Thanks

Actually Yacko - I did answer your question 3 days ago. Also, I've read your thread at the other forum and several people over there gave you various methods for handling this.

You do have a css style sheet. It's named xsp_style.css. In that file is a rule for BODY. Make that definition read like this:

BODY {
FONT-SIZE: 8pt;
MARGIN: 0px;
COLOR: #000000;
FONT-FAMILY: Tahoma, Sans-Serif;
BACKGROUND-COLOR: #ffffff;
background-image: url(bkg.gif);
background-repeat: repeat-x;
background-position: top;
}

This is adding the 3 lines for the background - background-image, background-repeat and background-position.

Upload your edited css file.

Make a new image from a blank part of your header that's 2 or 3 px wide and the full height of 150 px. You'll have a very thin image that's black with the small border of gold at the bottom. Name this image bkg.gif and upload it into your images folder.

This is the way the site you referenced in your OP was set up.

You're not actually stretching the header - this adds a background that matches your header background and makes it appear that the header is filling the entire browser window - left to right.

The header image at WTS is only 450px wide. The rest of what you see is background. So, as long as you view that site at something above 450px, you won't get scroll bars. The browser just fills in the background as needed.

Most people use resolutions of 1024px wide or less. Seems like you're designing at 1280, so YOU don't get scroll bars, but most of the rest of the world will.

Finally, I think we've hit bullseye.

I've figured I actually do have a CS file thanks to Barbara. :].

But the problem isn't solved yet...

Where do I specify those details... >_<