Is it possible to change the background colour on my site from black to a gradient black/green. I was thinking either the whole page or just the main content section. I can of course change the box content colours on the left afterwards.
If you google for "HTML background color gradient" - using the American (mis)spelling - you will find a selection of sites giving advice on this.
I haven't tried this myself so I can't recommend any particular approach.
I assume that you have permission to use the trademarked Lloyds Banking Group logo on the site. Big name trademark owners can get touchy (and have lawyers eager for a fee) so you are best advised to double check that this use is covered in any sponsorship agreement.
For you English "Purists", you may be saddened to learn that the word "colour" is not English. It arrived on your Sceptered Isle sometime AFTER 1066. The French adapted the latin (Color-Colorum) and gave us "Colur". The original Old English word was "hiw", from which we derive "Hue".
You can do the search without any spelling issues. Most of the hits will be due to the words "HTML", "background", and "gradient".
It looks like you pages were originally created in the Website Wizard, but you have since started editing them outside the Wizard. That makes changing your background a little bit easier.
You can create your own background gradient at a site like GRSites.com. Just follow the steps presented to you and download the gradient image. The open up your "style.css" file in an editor and add a "background-image" attribute to your "body" style. Because all of your pages use the same style sheet, they will all see the change
Code:
body
{
font: 0.8em Trebuchet MS, Arial, Sans Serif;
background-color: #000000;
<span style="font-weight:bold;">background-image:url('gradient82349421.png');</span>
margin: 0px;
padding: 10px 0px;
}
Then when you view your pages, you will see that your main content area has not changed. You have two choices here. You could make the main content area background transparent, or assign another gradient as the background. To make it transparent, edit the "mainContent" style in your style sheet to read as follows. I prefer to just comment out code, until I am sure I don't want it any more. An example can be seen at home page test with transparent content background.
Hi Philo
You are quite right, the pages were originally created in the Website Wizard, but have since been edited outside the Wizard.
That looks well, the only thing is when I view it on my screen the page is broken up a bit. The black content area only fills two thirds of the screen with the other part being green. It's the same along the bottom.
My screen is set at 14440x900
Thanks
I read your response a couple of times, but I still don't fully understand what your saying.
The gradient image that I created is 1024 pixels wide. For larger screens, the image will repeat itself at the 1024 mark. It should go from green to black, and then start repeating with green. The image is only 50 pixels high, but it repeats itself vertically as well. I could have made it one pixel high, and the effect would still be the same.
If you want an image where the repeat is not as noticable, use GRSites "Horizontal Repeat" rather than simply "Horizontal". This will transition from one color to another and than back. So it appears to be smooth across any resolution.
Browser: Firefox, Netscape, Sea Monkey, Internet Explorer, .....
