Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

If we limit ourselves to the default method of changing backgrouds we will find that any resizing of the input window will not resize the background image (example below);

Notice that when using Using this method the background image does not resize when to fill the window size is changed (example below(notice how in the example below more of the image is revealed to the right of the window);

If a resizing background is required then instead of using the "BACKGROUND IMAGE" button to store our background we should place our image against "CONTENT HEADER TOP" and include some CSS script in the section ".content-header-image" using the "CSS" button.

...

After removal of the old background, adding the image to the content header, and updating our CSS script we save the customisation and now when we resize the page we see the backgound resizes with the page;

If you want a more interesting effect you could use a transparent image for the content header top, then supply a complementary image background image (using the "BACKGROUND IMAGE" button).  By using both images the background could just provide a texture background whilst the transparent re-sizing images would overlay on this background.  Additionally you can adjust the "%" and "px" parameters in the CSS script to resize other horizontal and vertical aspects of the page presentation.