Centering a web page on a large screen? [Archive]

Click to See Complete Forum and Search --> : Centering a web page on a large screen?

hotwinduk

04-20-2005, 07:36 AM

I have seen sites that, when they appear on screens with high resolutions, such as 1280X1024, they appear in the middle of the screen with two empty bands down the left and right-hand sides.

I have a site that appears on the left side of such a screen with a large empty white space showing on the right-hand side.

If anyone knows how to achieve the centering of the page, I would be grateful if you could explain how it's done.

This is a site that fills a 800X600 screen, and is centered on a 1280X1024 screen:

http://www.wanadoo.co.uk/

tantone

04-20-2005, 12:16 PM

I can be more detailed if you link to your page so I can see your code, but usually it's done through CSS by setting your left/rigght margins to auto. That will work in a compliant browser like FireFox, but for IE you'll have to give the body a text-align: center and then re-align the text to the left for the child elements.

CompGeek01

04-20-2005, 12:51 PM

http://glish.com/css/7.asp

You can modify those to have empty sides if you like.

Swordfish

04-20-2005, 01:34 PM

as tantone said, CSS is the way to go....

but i have seen sites using the <center> </center> codes to load the page in center no matter what resolution. u have to design the page in lower resolution like on 800*600 since pages shouldn't go beyond the screen size.....the center tags take care for higher resolution.

try that insert <center> after <body> and then close it before closin body.

rather simple but a very handy tag.:t

cusimar9

04-20-2005, 01:59 PM

If I'm making a non-resizeable page I always make the whole page in a table, which you can then center

You can then use the cells in the table to layout the content ;)

tantone

04-20-2005, 02:05 PM

Tables should only be used for tabular data, not page layout design. Therein lies the nature of CSS--separating the content from the design.

In the end, there are all kinds of ways to do it. But if you want to do it properly and be on par with current web standards, CSS is the way to go.

cusimar9

04-20-2005, 04:16 PM

I'm an absolute beginner to CSS I think. I've found lots of very clever stuff you can do with CSS but have never gone as far as using it for page layout.

Looks good. Maybe I should give it a go on my next site.

Out of interest, what is the current web developer 'view' on using Frames?

I've gotten into a habit of using 3 frames on all my pages - a left menu, a top title frame and a main 'content' frame.

I think it looks good but I don't see many 'big' sites using frames like that.

Its a bit difficult learning to be a web designer by reading from a book :(

tantone

04-20-2005, 04:34 PM

Frames should be avoided unless there's no other way. And, if you do incorporate frames, you should have your site configured to display for those without frames-capable browsers.

The reason you don't see your use of frames much on the internet is because the same effect is accomplished with server-side includes.

You create a sidebar menu, a title bar, or any other piece of the site you want to repeat on several pages, as it's own .html file. Then you simply call (or "include") that file from within another page.

As an example, take a look at my personal site. www.taylorandjanet.com

The header at the top, the top menu, the side menu, and the footer are all include files, called from the content page.

Best way to learn this coding is to find a site that uses the techniques you're trying to learn, then reverse engineer the code and begin to build your own site piece by piece using your new knowledge.

cusimar9

04-21-2005, 04:07 AM

You know when you thought you were getting to grips with something then you find out you've been doing it wrong and you have to start all over? :(

Looks like there's a LOT to learn :rolleyes:

CSS pages do look very nice though.

This is the sort of thing I've been doing:

http://www.richlyn.co.uk/

As you can see, its all frames and very little CSS...

tantone

04-21-2005, 02:19 PM

Don't think of it as wrong. Frames were the way to go back in the day. But with the introduction of CSS and the continual updates to it, a combo of XHTML and CSS can be extremely powerful.

The idea of your HTML document being only the content and introducing the ability to simply change the CSS document and create a completely different page is awesome.

Check out www.csszengarden.com for an illustration of this. If you view the source, that page never changes. The only thing that changes is the CSS documents that people write and submit.

cusimar9

04-22-2005, 04:02 AM

Yeah I've seen that, absolutely amazing that is :)

I'll look into it for my next site, gotta finish 3 sites before I can start 'fresh'

Rick

hotwinduk

04-22-2005, 10:22 AM

Thanks for the useful input, gents.

Tantone, you say not to use tables to create the webpage within, biy that's how my pages work.

I used Dreamweaver 3 to create layers within one big layer and then converted the layers to tables.

That means that I could use the <center> trick.

How would I be able to convert my pages so that they're configured by CSS all the way through?

I just use a CSS file to configure the text and links and table data.

tantone

04-22-2005, 10:35 AM

hotwinduk--
To go from your current design to a full CSS design would require a rewrite. But that's the fun part!

hotwinduk

04-26-2005, 05:08 AM

Thanks, tantone.

I'll try finding out how to do it by following your link:

http://www.csszengarden.com/

tantone

04-26-2005, 09:39 AM

Well, that link is more of an illustration. If you want to learn CSS, w3schools is a good site, htmlgoodies, and you can also try THIS (http://www.yourhtmlsource.com/) one. It's pretty straight forward.

If you're into tinkering, a great way to jump and get immerse yourself is to reverse engineer a site. Take a current site and it's CSS and then start playing with the code on your local computer. Change stuff and see what it does.

hotwinduk

04-29-2005, 10:45 AM

Thanks!

I also found an interesting site that allows you to pick what styles you want and then generates the HTML and .css file:

http://www.csscreator.com/