Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > CSS Background

Reply
Thread Tools

CSS Background

 
 
moif
Guest
Posts: n/a
 
      06-13-2005
Hi Group,

I'm very new to CSS so please be gentle!

I'm starting a blog in reference to my World of Warcraft adventures and I'm
using a default blog theme that I'm hacking to pieces in Dreamweaver. If you
take a look at http://www.brightonbreaks.co.uk/blog/ you can see the start
of something that I hope will evolve into something interesting etc etc.

However, the theme I'm using is obviously CSS based (kudos to Douglas Bowman
@ www.stopdesign.com) and I'm having some issues with the code. What I want
to achieve is the background to dynamically resize in all browsers at all
resolutions. It's been a while since I used HTML or even looked at CSS and I
was wondering how this can be achieved.

I'm running a resolution of 1280 x 960 and the bg image is 800 x 600. It
appears to be short off the bottom by an inch or which makes sense. Would I
have to increase the size of the bg image and then force a shrink for any
browsers that are running at a lesser res?

TIA for any help / pointers.


 
Reply With Quote
 
 
 
 
Andy Dingley
Guest
Posts: n/a
 
      06-13-2005
On Mon, 13 Jun 2005 17:14:00 +0100, "moif"
<(E-Mail Removed)> wrote:

>What I want to achieve is the background to dynamically resize in all browsers at all
>resolutions.


You can't (practically, or with CSS alone).

Set the background colour to be an innocuous colour lifted from the
image,
background-color: #006600;

maybe set the "real" background image to be left-aligned rather than
centred (probably not necessary in this example though), and just let a
solid colour border fill in the gaps .

Or else do something clever with aligning the horizons on each side and
then change
background-repeat: no-repeat;
to
background-repeat: repeat-x;
for an infinitely wide forest

If you want to be clever (always risky) place your "real" background
unrepeated into a <div> that you use for content and have the background
of the <body> replaced by a repeating image of simple sky/grass/horizon.

Now given the target audience, they're going to have broadband and big
screens. So 100k for a bgimage isn't out of line. But for normal web
use, compress the hell out of it and get it under 25k.

> I'm running a resolution of 1280 x 960 and the bg image is 800 x 600. It


It's actually 1024 x 768 - that should be plenty big enough, just with a
mid-green canvas to it.
 
Reply With Quote
 
 
 
 
moif
Guest
Posts: n/a
 
      06-13-2005
Andy Dingley wrote:
> On Mon, 13 Jun 2005 17:14:00 +0100, "moif"
> <(E-Mail Removed)> wrote:
>
>> What I want to achieve is the background to dynamically resize in
>> all browsers at all resolutions.

>
> You can't (practically, or with CSS alone).
>
> Set the background colour to be an innocuous colour lifted from the
> image,
> background-color: #006600;
>
> maybe set the "real" background image to be left-aligned rather than
> centred (probably not necessary in this example though), and just let
> a solid colour border fill in the gaps .
>
> Or else do something clever with aligning the horizons on each side
> and then change
> background-repeat: no-repeat;
> to
> background-repeat: repeat-x;
> for an infinitely wide forest
>
> If you want to be clever (always risky) place your "real" background
> unrepeated into a <div> that you use for content and have the
> background of the <body> replaced by a repeating image of simple
> sky/grass/horizon.
>
> Now given the target audience, they're going to have broadband and big
> screens. So 100k for a bgimage isn't out of line. But for normal web
> use, compress the hell out of it and get it under 25k.
>
>> I'm running a resolution of 1280 x 960 and the bg image is 800 x
>> 600. It

>
> It's actually 1024 x 768 - that should be plenty big enough, just
> with a mid-green canvas to it.


Hey great, thanks for all the advice! Defiantely some things there for me to
chew over. Oh and the BG is being reduced to a gif as we speak.

Thanks again.


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
DIV background-repeat background-image? For shadow effect jc ASP .Net 3 03-19-2008 04:19 PM
DIV background-repeat background-image for shadowing effect jc HTML 1 03-19-2008 02:16 PM
not able to click on background tab and backgrounds in properties to change the background. rex Computer Support 2 12-06-2006 02:26 AM
Background transparent when 'background' is used JWL HTML 4 09-26-2006 05:37 PM
Background Check - Background search - People search mason66 ASP .Net 0 07-27-2006 10:20 AM



Advertisments