How do I stretch images to occupy the whole browser window

you'll have to resize the browser window to understand the effect...

Note: Your server does not support downloading the project .IMS file. You will need to set up a MIME type for it, or maybe zip it before it can be downloaded.

Both SS and SS-Pro have a resizing tools - Relative Horizontal Sizing and Relative Vertical Sizing. It is part of the Arrange toolbar. If you cannot see these tool buttons, right-click on a toolbar to open the Toolbar Options window, go to the Arrange menu and add the tools. However, these tools will not do what you want. While they will allow the image to fit the page, it stretches the image rather than maintaining the aspect ratio.

You should be able to get the effect you want by adding the image to your page, positioning the top to where you want it on the page, then adding some CSS to override the default CSS code. In a CSS code object, use:

#Oobj1 {
  left: 0;
  right: 0;
  width: 100%;
  height: 100%; /* or auto */
}
#Oobj1 img {
  object-fit: cover;
}

Replace obj1 with the object name of your image.

thanks larryd. I put the .IMS into a zip.

This CSS allows me to have full visibility over the positioning of the image and it does indeed resize as desired;

1. http://www.otkrit1.com/shrink.html), provided;

- the page is not centered (seems to overide the CSS otherwise)

- 'height' in the CSS is set to 'auto' to allow it to scale in proportion and otherwise prevent distortion and

- you use explorer.

However seems to go haywire in chrome and doesn't work if page has centering as per;

2. http://www.otkrit1.com/center_horizontal.html

I also found (as you described) the "relative horizontal sizing" feature in sitespinner. However I understand it doesn't work with page centering on. Also it only is good for forcing the image to span the [width of the] web page - not the browser page.

If I use page centering (as explained in link 2 above), my web page will be centered in the middle of the browser window, but the provided CSS won't facilitate header banners (image) spanning the browser window width.

I do not understand why you do not what this as a background rather than filling a <div> block. You get the same effect with much less code overhead. After you have added the image as a page background (with the Image button), add the following CSS to make it file the following code:

body {
  background-size: contain;
}

ah, well then I have 2 questions. With regards to an image as a background only, I almost pulled it of, but not sure how to relate the code to the image, in order to force the horizontal stretch to get it to fit into the browser window (width) as per;

http://www.otkrit1.com/resize_image4.html

The second point. The original question doesn't actually relate to the background, but to any image on the page as per;

http://www.otkrit1.com/resize_image5.html

perhaps it is simply not possible to get images authoured into the web page space to stretch 'outside' fully into the 'browser' space, with horizontal centering switched on....

Try changing the background-size from contain to cover.

larryd please check your private message from me.

Best,

captainstevo

steve murphy

www.desertclassics.com

anaconda mt usa