Hey there,

 

I was wondering if I can use a background image that's about 1300pixels wide and set some code so that those with smaller screen don't have to scroll and the image stays 100% in size? So they are seeing less of the image but it's still the same size.

 

Thank you

You can use background-attachment: fixed to fix the position of the image.

 

background-position lets you anchor it to a particular corner

 

 

body {
   background:#4C636A url(images/bg.jpg) 0 0 repeat-x;
   background-attachment: fixed;
   background-position: bottom right;
}

A background-image cannot stretch but you can use a normal image with position: absolute; or position: fixed; width: 100%; left: 0; right: 0; which ties the image to the sides so that it will always be 100% wide.

 

Put it in a container and layer page content on top or use position: absolute with z-index: -1 so that it's always underneath like I did here:-

http://www.wickham43.net/backgroundfullwidthflexible.html

Drag the window wider and narrower to see the effect.