Object positioning and page resizing

Prior to version 8, you had to use the Selector Tool to manually adjust the position of items on the page. Similarly you had to drag the bottom of the page down to enlarge the page to accommodate growing text objects.

Version 8 & later have the ability to make growing text areas automatically push other objects down the page, and also resize the page automatically to accommodate the enlarged text areas. Version 8 templates and later versions are designed to support both push and page resizing.

What's changed in version 9 in relation to object positioning and page resizing? 

In V9 pull features have been implemented to compliment push.

Can I still manually resize my web page?

Absolutely. You can still set the required page size from the Page size tab from the Page Options dialog. As in previous versions, you can also drag the bottom and right side of the page to increase the height or width. V8 made this easier by displaying a green dotted line at the bottom of a page allowing you to easily click and drag the page to increase or decrease its height.

How can I control object positioning on a page?

If you right click on an item, there is a new Position on Page menu with the following options:

Fixed - the position of the object remains at its set x and Y value even when resizing the page.
Footer - this will keep the items at the same relative position to the bottom edge of the page as the page is enlarged or reduced.
Automatic - this option retains the relative position of the selection to the top, bottom, left or right side of the page, depending upon which is most appropriate.
Stretch with page - sometimes part of your page design will consist of background rectangles that you want to change size with the page. To do this select the right-click menu
Push - objects can be marked as Push with the top and bottom margins set. Setting an object to have a bottom margin of 40px, will mean that whenever it gets to within 40 pixels of another ‘Push’ object, it will push it down the page.

Items set to Push like this will also automatically push the bottom of the page down. The Push feature only moves objects down the page automatically as they grow (and enlarges the pages), but it does not do the reverse and pull items up. You still have to manually move items on the page back up. If you want to shrink the page, it’s just a matter of using the Selector Tool to drag up the lower edge of the page.

How does Pull work?

In order for objects to be pulled, they must have Push applied and be within the margin of the other object with Push enabled.

It's recommended that you read the Web Designer 9 release notes chapter covering this section as this has illustrations to show how the feature works.

I have moved an object on the page but the page has not pulled back up

If you have moved or deleted an object that has push applied and it is at the bottom of the page, this will not automatically pull the bottom of the page to the nearest object with Push enabled, a gap is left and the page is not resized. This is because you may have deleted those objects to insert different objects in its place, so pulling the page up in that scenario would not be useful.

The Pull feature will retract the bottom of the page when the objects that have Push enabled are edited and made to reduce their size and the objects below them are within their push margin range. For example in the case where some text is deleted from a text column and the footer is within the push margin of the text object, the page would retract.

Can I prevent my page from resizing?

The ability to lock your page size was introduced in version 8. Selecting to lock page size will affect all pages within your document.

  • Select the Utilities menu option followed by Options
  • Click on the Page Size tab
  • Enable the check box labelled lock page size
 
 

 

Copyright © Xara