I do not have access to server-side scripting (PHP) so hope I'm not missing any of your points.
But some basic CSS points to note: The COLOR property is your "foreground" and applies to text and border (if no border-color is set).
You might look into new CSS3 properties
background-size and
background-origin [see for example
http://www.w3schools.com/css3/css3_backgrounds.asp or
http://www.css3.info/preview/background-size/ or
http://css-tricks.com/perfect-full-p...kground-image/ As CSS Tricks noted
Quote:
We can do this purely through CSS thanks to the background-size property now in CSS3. We'll use the html element (better than body as it's always at least the height of the browser window). We set a fixed and centered background on it, then adjust it's size using background-size set to the cover keyword.
html { background: url(images/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; }
|
The background "shorthand" above includes
background-repeat and
background-position (which your CSS did not show).
With your background-image set for HTML selector, the BODY selector
could have
background: transparent; or semi-transparent
background-color: rgba(255,255,255, 0.25); and
#PAGEWRAP background-color: white; or 75% semi-transparent white background-color: rgba(255,255,255, 0.75);
and use
color: black (or whatever) for the text ("foreground")