LinkBack URL
About LinkBacksHi. I'm taking my very first shot at site building using Photoshop CS3, and finding it quite easy and useful in getting the exact look I want. There's just one remaining task....getting the background layer (just a plain solid color) to have a variable width for anyone using a screen res wider than 1024. Currently, if I look at the page on a larger screen, the color stops at 1024 and the space to the right is just plain white. I want that color layer to fill the browser window, no matter how wide.
Do I need to somehow convert that layer to "CSS" (which I know nothing about) to get that variable width? Is CS3 capable of getting this result?
[Before you reply...I realize that Photoshop is not the best tool for web design, but please don't suggest that I purchase new software or learn html. I am just building one site for my own personal use, and that's it. I'm not yearning for a career in web design, and once this site is done, I'll likely never do it again. Besides, this site is about 95% finished, and it looks beautiful...just the way I was hoping it would turn out. Once this last little detail is solved...case closed.]
Many thanks!
Fred
+ Reply to Thread
Results 1 to 2 of 2
-
02-19-2008, 08:43 PM #1Newbie
- Join Date
- Feb 2008
- Posts
- 3
- Thanks
- 0
- Thanked 0 Times in 0 Posts
Variable width layer for web use?
-
04-27-2008, 03:21 AM #2Guru
- Join Date
- Feb 2002
- Location
- Kelowna, BC Canada
- Posts
- 2,256
- Thanks
- 1
- Thanked 4 Times in 4 Posts
Piece of cake Fred.
What you've ended up doing is slicing/saving your Ps document's background colour as part of the images that make up your site's look. Generally that's not done, but it's an easy fix.
Not that it matters much to you now, but the option in Ps's '"Save For Web" options window to "save a copy of the background colour/layer" might or might not help you, depending on what you're trying to achieve.
None-the-less... your solution now is a simple one. Put this code within the <body> tag in all of your html pages (it's near the top of the code): bgcolor="#put your color number here". For example: bgcolor="#4e6b2a".
To get this specific hex number, simply use the Eye Dropper tool and click on the background colour in your Photoshop web page document. This will assign your foreground colour to the toolbar. Click on that colour in the toolbar and at the bottom middle-right of the colour editor window that opens you'll see the hex code for that colour. (See the sample image attached) Copy&Paste that hex code to your html page's BODY tag the way i explained.
Just open your html document with Note Pad (or the Mac equivalent). The <BODY> tag is easy to find.
Hope this helps.
Reply With Quote
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts