The complete answer depends a lot on the rest of the layout – what’s in it, how it is constructed.
If I were building a page-in-a-page layout, I would first draw an HTML box where I wanted the content to go, then apply a background image to that box that was different/separate from the background I applied to the entire page. Both of those background images would be applied using the Inspector’s Style tab. The only difference would be that to apply a background to the page, I would first click somewhere empty on the pasteboard, so that nothing on the page was selected.
Once those two backgrounds were attached, I would next decide whether to build a nested positioned layout or an inline layout. This decision would be based on the kind of content I was showing. If there was text galore, and particularly if there was a variety of content lengths, I would always use an inline layout. If it was nothing more than a collection of static photos, I could use either approach.
To make an inline layout, I would double-click inside the first HTML box (the “page” container) and use the main menu to Insert / HTML Item for each layout element needed inside the page (main left column, right column, header, whatever your layout requires. Each of these HTML boxes would be stretched out to the shape needed, and floated left or right (or not at all) to make the puzzle pieces. Then text or image content would be inserted inline within each inline element, and finally, all of the heights of these elements would be collapsed by clicking on the icon left of the height field in the Inspector for each element. Now everything would be flexible, and would respond in a reasonable manner if the text size was increased (or the content was changed with a CMS – my usual requirement). Background images (or colors) don’t mind if the content gets larger. They either tile or re-center depending on the settings you’ve chosen, so the illusion remains consistent in all browsers.
To make a nested positioned layout, I would first click once on the main HTML box, then use the construction tools to draw another element over the top of that base “page” HTML box. When you do this, you will see a blue glow highlight on the edges of the HTML box, indicating that the HTML box is the “parent” of the element you are currently drawing. (It’s also possible to re-parent elements after you’ve drawn them, but drawing them deliberately like this is a good way to get precisely what you expect.) For each additional element, you follow the same steps: first click on the HTML box, then draw. When you do this, you don’t need to rely on floats or margins to make your layout, but you lose the benefit of a truly inline layout: if font sizes are changed by your visitors, the layout will break. This is not a problem if all you have on the page are images – they don’t scale along with the type, so they will stay put and not break any illusions.
Walter
On Nov 6, 2012, at 11:23 AM, David Phelps wrote:
Hi Walter,
I understood Nina’s question as wanting a page area different from the entire browser window. > I am trying to make my page area different than my browser area.<
What is the best way of achieving this?
Thanks, David
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options