Centering web pages

[Basil the Fox [email protected]]

How do you get a web page to sit in the centre of the screen both horizontally and vertically (like this one [url]http://www.fudgestudios.com/[/url] for example) at different screen resolutions?

I've saved the web page to my computer and opened the thing up in Dreamweaver but i'm finding it difficult to assertain what's going on. I assume it's something to do with autostretch tables but my own experiments have met with varying degree's of faliure.

Some people have sugested using CSS but I struggled to find a working method at all.

If anyone can give me step by step instructions that'd be a great help.

[Tal]

i think this is the relevant code......

<tr>
<td height="1" width="100%">&nbsp;</td>
</tr>
<tr>
<td width="100%" height="100%" valign="middle">

> How do you get a web page to sit in the centre of the screen both

horizontally and vertically (like this one [url]http://www.fudgestudios.com/[/url] for
example) at different screen resolutions?

>
> I've saved the web page to my computer and opened the thing up in

Dreamweaver but i'm finding it difficult to assertain what's going on. I
assume it's something to do with autostretch tables but my own experiments
have met with varying degree's of faliure.

>
> Some people have sugested using CSS but I struggled to find a working

method at all.

>
> If anyone can give me step by step instructions that'd be a great help.
>
>

[Dan Vendel *GOF*]

"Basil the Fox" [email][email protected][/email] wrote:

> How do you get a web page to sit in the centre of the screen both horizontally and vertically (like this one [url]http://www.fudgestudios.com/[/url] for example) at different screen resolutions?
>
> I've saved the web page to my computer and opened the thing up in Dreamweaver but i'm finding it difficult to assertain what's going on. I assume it's something to do with autostretch tables but my own experiments have met with varying degree's of faliure.
>
> Some people have sugested using CSS but I struggled to find a working method at all.
>
> If anyone can give me step by step instructions that'd be a great help.
>
>
>
>

They have a nested table construction. The outer (parent) table has 100%
width and 100% height attributes. The latter is deprecated html, and
might work in most browsers, but might not in others. Then they have
aligned the child table, which is the one that holds the content you
see, vertically "middle".

AFAIK, there are only two ways to achieve this without glitches. The
first is to use a frameset called "Letterbox frameset", applied by an
extension available at [url]www.projectseven.com[/url]. However, if you don't know
the problems that will come with framesets, DO NOT go there!!!!!!!!

The other way is to use another extension at [url]www.projectseven.com[/url] called
"Layout Designer 2". With this, you can place layers aligned both
vertically and horizontally at the page.

If you can tell which day it is, you can also use these extension
without problems.


--
Dan Vendel - *GOF*
[url]http://www.vendel.info[/url]
Contact me directly by clicking here:
[url]http://contact.vendel.info[/url]
Formmail tutorial:
[url]http://www.vendel.info/tut/formmail.html[/url]
Nested table demonstration:
[url]http://www.vendel.info/tabletut/[/url]

[David Powers]

Basil the Fox wrote:
:: How do you get a web page to sit in the centre of the screen both
:: horizontally and vertically (like this one
:: [url]http://www.fudgestudios.com/[/url] for example) at different screen
:: resolutions?
::
:: I've saved the web page to my computer and opened the thing up in
:: Dreamweaver but i'm finding it difficult to assertain what's going
:: on.

That's why it would be a bad idea to try to follow that type of design. It's
chock-a-block with nested tables. Make one mistake, and the whole thing
falls apart. It's difficult to code, and would be a nightmare for a disabled
person using assistive technology to browse the web.

There are several ways to centre your page vertically and horizontally. The
oldest trick in the book is to create a table 100% wide and 100% high with
just one cell, and set the alignment to middle and center. Then put the rest
of the page in another table inside that cell. It's not a good idea, though,
because sooner or later you're going to need to use CSS and
standards-compliant code. Take a look at the following demonstration to see
what happens to 100% high tables when a browser renders a page in
standards-compliant mode:

[url]http://japan-interface.co.uk/testarea/tableheight.html[/url]

Another way to centre your page is to use JavaScript. Project Seven
([url]www.projectseven.com[/url]) has a free extension called Layout Designer 2 that
will do that, and much, much more for you. Project Seven has also got a lot
of good free tutorials that you might find very useful.

--
David Powers
*******************************************
No-nonsense reviews of computer books
[url]http://japan-interface.co.uk/webdesign/books.html[/url]
Save 10% on TopStyle CSS Editor
*******************************************

[Womble]

1. Insert a table which is 100% W by 100% deep
2. Click inside the table and set Horizontal to centre and Vertical to middle
3. Insert another table which is less than 100% by 100%
4. Insert all content into second table

That's it


Matt

[Murray *TMM*]

Amazing. Wrong.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
[url]news://forums.macromedia.com/macromedia.dreamweaver[/url] - THE BEST WAY TO GET
ANSWERS
==================
[url]http://www.dreamweavermx-templates.com[/url] - Template Triage!
[url]http://www.projectseven.com/go[/url] - DW FAQs, Tutorials & Resources
[url]http://www.DreamweaverFAQ.com[/url] - DW FAQs, Tutorials & Resources
[url]http://www.macromedia.com/support/search/[/url] - Macromedia (MM) Technotes
==================

"Womble" <[email protected]> wrote in message
news:bf66gm$bf9$[email protected]..

> 1. Insert a table which is 100% W by 100% deep
> 2. Click inside the table and set Horizontal to centre and Vertical to

middle

> 3. Insert another table which is less than 100% by 100%
> 4. Insert all content into second table
>
> That's it
>
>
> Matt
>
>

[Murray *TMM*]

It's like we aren't even speaking the same language.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
[url]news://forums.macromedia.com/macromedia.dreamweaver[/url] - THE BEST WAY TO GET
ANSWERS
==================
[url]http://www.dreamweavermx-templates.com[/url] - Template Triage!
[url]http://www.projectseven.com/go[/url] - DW FAQs, Tutorials & Resources
[url]http://www.DreamweaverFAQ.com[/url] - DW FAQs, Tutorials & Resources
[url]http://www.macromedia.com/support/search/[/url] - Macromedia (MM) Technotes
==================

"Basil the Fox" <[email protected]> wrote in message
news:bf68vm$glf$[email protected]..

> Brilliant!
>
> I knew it would be a relatively simple solution in the end.
>
> Thank you Matt.
>
>
>
>

[P@tty *TWB*]

Dan, I think you should include the *GOF* with your name, to warn people.
:-)

Patty



"Dan Vendel" <[email protected]> wrote in message
news:bf6a6q$j7c$[email protected]..

> Jeez....
>
> You have previously been told TWICE that exactly that proceeding is

DEPRECATED html, and will not work in all browsers. These two posts (from me
and David Powers) are seen in the webforum, which you are using. Had you
been accessing this group with a newsreader instead, you would have seen
another 2-3 posts telling you exactly the same:

> Giving the parent table a height of 100% is DEPRECATED and will not work

in all browsers...

>
> Dan V
>
>
>

[Dan Vendel [email protected]]

Jeez....

You have previously been told TWICE that exactly that proceeding is DEPRECATED html, and will not work in all browsers. These two posts (from me and David Powers) are seen in the webforum, which you are using. Had you been accessing this group with a newsreader instead, you would have seen another 2-3 posts telling you exactly the same:
Giving the parent table a height of 100% is DEPRECATED and will not work in all browsers...

Dan V

[Dan Vendel *GOF*]

P@tty *TWB* wrote:

> Dan, I think you should include the *GOF* with your name, to warn people.
> :-)

Considered that, but logging in to the webforum is such a PITA, I was
too exhausted for anything else than just posting the reply.
Maybe people should pay more attention if I abbreviated Grumpy Old Dude
instead....

--
Dan Vendel - *GOF*
[url]http://www.vendel.info[/url]
Contact me directly by clicking here:
[url]http://contact.vendel.info[/url]
Formmail tutorial:
[url]http://www.vendel.info/tut/formmail.html[/url]
Nested table demonstration:
[url]http://www.vendel.info/tabletut/[/url]

[Basil the Fox [email protected]]

Jeeez Dan! I saw yours and David's replies after Matt's.

I'm reading Project seven's page now and I have marked David's reply as the answer to my question using the web forum.

Thanks for the help.

Greatly appreciated.

[Womble]

Nice to see such pleasant and helpful people encouraging new users. I mean after all there's enough people who can do web design and use MM products, we don't need anybody new coming along, do we?

Basil asked how to centre something is a page. Not how to centre something in a page which all browsers could read which utilized techologies he proably hasn't learnt yet .

Maybe, just maybe, the best way for someone to learn is to put them on the the first step, then hold their hands whilst they encounter problems, and then applaud when they acheive something.

Would any of you have learnt to walk if your Mom's had critised because you fell over, bumped into things, couldn't stop etc. No? Then stop, think and consider when you reply. How would you like someone to relpy to your e-mails in such a way.

Matt

[P@tty *TWB*]

> > Maybe people should pay more attention if I abbreviated Grumpy Old Dude

> instead....

Yes, that describes you a little better. :-)

Patty

[Michael Howarth]

Just to reiterate (as I'm now browsing via the nntp forum)

The first reply I saw on the web version of the forum was Matt's, there were
no other replies visible at the time.

I can see how my initial reply looked as though I was being a div and
ignoring yours and David's original replies, Dan but to a certain extent
Matt is right. I needed a simple solution initially (which he gave
perfectly) just to set me off on the right footing. Like I say, I'm looking
at Project Seven's pages now for their Page layout software and their CSS
layout tutorials.

Cheers

Basil

[Murray *TMM*]

Womble:

So a simple solution that doesn't work is better than more complex solution
that does?

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver MX
(If you *MUST* email me, don't LAUGH when you do so!)
==================
[url]news://forums.macromedia.com/macromedia.dreamweaver[/url] - THE BEST WAY TO GET
ANSWERS
==================
[url]http://www.dreamweavermx-templates.com[/url] - Template Triage!
[url]http://www.projectseven.com/go[/url] - DW FAQs, Tutorials & Resources
[url]http://www.DreamweaverFAQ.com[/url] - DW FAQs, Tutorials & Resources
[url]http://www.macromedia.com/support/search/[/url] - Macromedia (MM) Technotes
==================

"Womble" <[email protected]> wrote in message
news:bf6bqi$mpv$[email protected]..

> Nice to see such pleasant and helpful people encouraging new users. I

mean after all there's enough people who can do web design and use MM
products, we don't need anybody new coming along, do we?

>
> Basil asked how to centre something is a page. Not how to centre

something in a page which all browsers could read which utilized techologies
he proably hasn't learnt yet .

>
> Maybe, just maybe, the best way for someone to learn is to put them on the

the first step, then hold their hands whilst they encounter problems, and
then applaud when they acheive something.

>
> Would any of you have learnt to walk if your Mom's had critised because

you fell over, bumped into things, couldn't stop etc. No? Then stop, think
and consider when you reply. How would you like someone to relpy to your
e-mails in such a way.

>
> Matt
>
>

[Paul Taylor]

On Thu, 17 Jul 2003 21:18:26 +1000, "Tal"
<[email protected]> wrote:

>i think this is the relevant code......
>
> <tr>
> <td height="1" width="100%">&nbsp;</td>
> </tr>
> <tr>
> <td width="100%" height="100%" valign="middle">
>
>

height is not a valid attribute for a td tag and therefore should not
be used.


Paul Taylor

[Michael Fesser]

Basil the Fox wrote:

>How do you get a web page to sit in the centre of the screen both
>horizontally and vertically (like this one
>[url]http://www.fudgestudios.com/[/url] for example) at different screen
>resolutions?

I _strongly_ recommend not to do such things!

These little centered pages may look good on high resolution screens
with a big browser window, on small displays they're a disaster.
They're wasting valuable space on screen with absolutely nothing.

The guys at Fudge Studios may be good at webdesign, but they obviously
don't care about usability. Kids, don't try this at home!

Micha

[Dan Vendel *GOF*]

Michael Howarth wrote:

> Just to reiterate (as I'm now browsing via the nntp forum)
>
> The first reply I saw on the web version of the forum was Matt's, there were
> no other replies visible at the time.
>
> I can see how my initial reply looked as though I was being a div and
> ignoring yours and David's original replies, Dan but to a certain extent
> Matt is right. I needed a simple solution initially (which he gave
> perfectly) just to set me off on the right footing. Like I say, I'm looking
> at Project Seven's pages now for their Page layout software and their CSS
> layout tutorials.

No worries, Basil.

It's unfortunatelly not rare that people ask a question, get a few good
answers and one bad, and happily follows the latter. Usually, the "good
guys" don't give a hoot, since it's up to the original poster to follow
which ever advice he/she want. But occasionally, it's too frustrating.
Sometimes (as obviously in this case), it's due that frigging webforum
that MM could update once a minute if they has and interest in customer
care and support. Instead, the update is anything from 15 minutes up to
several days.
So, when I saw your response to Matt, I just had to go to the webforum.
When I did, I saw mine and David's replies. I made the mistake of taking
for granted that you had seen them, too.
Anyways, glad you saw the light eventually. The PVII guys have a lot of
goodies. And repeat the mantra:
"height attribute in a parent table is deprecated html. height attribute
in a parent table is deprecated html. height attribute in a parent table
is deprecated html. height attribute in a parent table is deprecated
html. height attribute in a parent table is deprecated html...." ;-)

Cheers,

--
Dan Vendel - *GOF*
[url]http://www.vendel.info[/url]
Contact me directly by clicking here:
[url]http://contact.vendel.info[/url]
Formmail tutorial:
[url]http://www.vendel.info/tut/formmail.html[/url]
Nested table demonstration:
[url]http://www.vendel.info/tabletut/[/url]

[David Powers]

Dan Vendel *GOF* wrote:
:: And repeat the mantra:
:: "height attribute in a parent table is deprecated html. height
:: attribute in a parent table is deprecated html. height attribute in
:: a parent table is deprecated html. height attribute in a parent
:: table is deprecated html. height attribute in a parent table is
:: deprecated html...." ;-)

Even better mantra:

Height attribute in table has NEVER been part of HTML - it's proprietary
Netscape (RIP) and Internet Explorer.

--
David Powers
*******************************************
No-nonsense reviews of computer books
[url]http://japan-interface.co.uk/webdesign/books.html[/url]
Save 10% on TopStyle CSS Editor
*******************************************