Centre page

Hi, if I create a webpage with a background say 2000x1500pix. Along the top of the background is an image. Then I place a 1000x1200pix page in the centre of that background with a row of buttons down the side. How do I get it so when the webpage opens in a browser the page along with the buttons opens up in the centre of the browser window? At the moment when I try it the page is always off to one side.
The attached jpeg is just an example of how I want the layout to look like...thanks roger

Example of how I would like it http://www.marilynsholin.com/

Quote:

---

Originally Posted by Tao jones

At the moment when I try it the page is always off to one side.

---

Hi Roger,

Is this a question about Xtreme 4 html output or are you asking if the new (yet to be released) Xara Web Designer will be able to suit your requirements?

Hi Sledger, not too wet up there is it? I suppose both. I am attempting to do it now in X4. I will buy the new program so maybe I should wait to see if it can be done in webdesigner...thanks r

Anything you put on the page in XX4 or WD as an object becomes part of the page and is exported as part of the size of the page template you use. Any overflow is removed.
If you were to start with a page dimensions of 2000x1500pix, WD will export the page and image at this size therefore the browser considers it's width/height and renders it from top-left. If the browser window and screen resolution isn't enough to contain the entire size of the background image, then scroll bars will be generated.
2000x1500pix is too large for any standard monitor at full screen in any case.

I think I know what you want, but I can't think if a way to have a dynamic background image which is so large who's width is ignored by the browser (overflow hidden) and doesn't produce scroll bars yet still know that the other elements should be in the centre.

John Horn may be able to offer more insight.

thanks sledger..example of how I sort of would like it http://www.marilynsholin.com/

I suppose I am asking if this can be done in WD.

When I made a test webpage it had scroll bars and the page I wanted was off to the side. I don't need it as big as I said but I would like to me able to do what she has done in the above link...roger

Hi Roger, yes my previous answer was for WD as I know it so far.
If you look at the source for your linked page you can see that the background image is assembled from several images (three parts for the shadows alone!) and repeat tiled across the screen as necessary using what looks like a combination of .css and perhaps some plugin. It's not one image only which I think is what you are wanting?

Apply your wide background image as a page background (Ctrl+Drag and drop on the empty page, or click the "Background" in the bitmap gallery).
Experiment with this. It may help you.
This works in both XXP4 and XWD.

John I think Roger is wanting Xtreme to ignor the page size so that a wide background image is relative to the browser window and not the Xtreme (or WD) 'page' size, yet still render the page content in the centre of the screen no matter what the resolution.

The page backround image in the Xtreme is exported as a repeated fill for the entire browser window regardless of the boundaries of the page.
This may be not perfectly what Roger wants because it does tiling in both directions and it synchronizes background position with page movement (due to centering). But it may be of some help.

correct sledger...this is one way I can do it use an image like this for the background which will repeat and then center a white page into the white area of the below image for text etc...roger

Hi John and sledger, I have just put up a test page with above the image..it centers on my screen but I would n't know what it looks like on a another size screen. This is sort of what I want to do...roger

http://bodyworkposters.com/test/index.htm

Correct. Just what I wanted to show you. :D

To see how it looks in lower resolutions you can simply resize the window of your browser.

Centers just perfect for me 24inch screen

Quote:

---

Originally Posted by Tao jones

..it centers on my screen but I would n't know what it looks like on a another size screen.

---

Roger your page centres on all screens from 1280x1024 upwards when the browser window is at full screen. Smaller screen resolutions or when browser windows are smaller, then the content will offset to the right on load. The user will have to scroll horizontally.

800x600 older 15" and 17" 4:3 ratio VGA CRT's
Attachment 57063
1024x768 17" 4:3 ratio SVGA CRT's
Attachment 57064
1280x1024 17" and 19" 4:3 ratio LCD screens
Attachment 57065
1920x1200 24" wide-screen 16:10 ratio LCD
Attachment 57066

19" 20" (1440x900) and 22" (1650x1050) wide-screen LCD's of 16:10 ratio or 16:9 ratio will also centre when the user has the browser window full screen (or above 1024 wide)

thanks sledger..looks like back to the drawing board. There must be away around it like the first link example I gave...what is the most popular size screen to create a webpage for now? roger

I think it used to be 800x600 but now it's 1024x768.

It depends on who you ask.
Webpages are being opened on all sorts of devices these days, from mobile phones, smart phones, netbooks, notebooks and desktop PC's with any size LCD screen from 16" widescreen to 30" wide.

Personally, I stick to max 800 wide for the content.
Most people in my experience do not run their browsers at full scree, especially those with large wide screen monitors.
There is code that forces a browser to go full screen on load, but this is just plain rude in my opinion, so I'd never use it.

This problem is why I'm so torn between using "absolute position values" and the good old-fashioned "percent of screen". Using tables with "percent of screen" pretty much adjusts to fit any viewing size.

While absolute position values seemed to give the designer more control over the look of the page, that control gets lost with the great variety of monitors/screens/resolutions. Most people find it a real pain to have to scroll sideways.

I normally put the whole page in a cell of a 1-cell table. That way you can align it horizontally in the browser.

Quote:

---

Originally Posted by nickydude

I normally put the whole page in a cell of a 1-cell table. That way you can align it horizontally in the browser.

---

I wouldn't recommend this. Using invisible tables in order to get a design is out-dated (since 2002 or so).

If you want to learn how to avoid such things and create modern Websites with CSS instead, then read the documentation of YAML (it's nearly a book with really helpful insights).

Remi

Looks interesting remi, I'll take a look at that, thanks. :)