Variable width Top banner

customizing my template.

[Delegate]

Hi,

Im not a designer by trade but do as much as i can myself then if i cant do anymore i get a pro.

My question is........is there any good tutorials out there or good advice someone can give me in creating a variable width Top banner for my joomla site that looks good both in 800 and 1024 or more.

Im sure there is some rules i must abide by, so any help would be appreciated.

Thks

Delegate

[mcjohnson]

what I have done is to create the banner in Photoshop at about 750 px. or so - making sure the right side is innocuous enough to look consistent if repeated.

Slice off about 40 px of the right side of the banner and place the two sections into your container on the web page (div or table, whichever you use. Obviously, you'll need to use a 100% width, instead of a fix-width container.)

Make a smaller slice of the RIGHT piece of your banner (about 20px or so), save it as a .gif to use as a background.

Alighn the big chunk of the banner left, align the smaller chunk right. use your background gif behind the images as a table background, and you'r good to go.

[limbo]

fades & blends are your friend. When working with fluid layouts a image theat blends into a block colour like the background property of a div can be useful - that way the area outside the image appear to shrink and grow. You could also do this with one or more images within the header - positioned with corresponding background colours - more images work best for very wider screens.

You can also set the property of an image to 100% - not recommended for most images - especially any that contain recognisable elements like people or text - but others like abstract images will stretch ok(ish).

and what mcjohnson says ^^ :)

[Delegate]

Thanks Guys,

Got it perfect!

WebmasterWorld!

"Always a solution........never a chore"