center of the page

[WindAndWaves]

Hi Gurus

Having been told off for using height in width in the table, td and tr tag,
can someone please tell me how I can center a page in the screen?

Right now, I use

<TABLE WIDTH=100% HEIGHT=100%>
<TR>
<TD WIDTH=100% HEIGHT=100%>
...my actual page
</TD>
</TR>
</TABLE>

How can I put this in css????

TIA

- Nicolaas

 

[rf]

WindAndWaves

Hi Gurus

The name is Richard, not Gurus

Having been told off for using height in width in the table, td and tr tag,
can someone please tell me how I can center a page in the screen?

Right now, I use

<TABLE WIDTH=100% HEIGHT=100%>
<TR>
<TD WIDTH=100% HEIGHT=100%>
...my actual page
</TD>
</TR>
</TABLE>

That "page" will use the entire canvas so it is already "centred".

How can I put this in css????

Do you mean:
<div style="width: 10em; border: solid 1px black; margin: auto; text-align:
center">
my content
</div>

 

[WindAndWaves]

dear Richard, sorry, but this has a completely different outcome.

please visit www.rakau.com for an example. Note, this is just a test page,
so do not worry too much about the other problems.

Note that in some of my earlier post some where quick to point out how
stupid I was, but none of them actually could answer my question.

Thank you once more for your reply Richard

- Nicolaas

 

[Peter]

WindAndWaves schreef:

dear Richard, sorry, but this has a completely different outcome.

please visit www.rakau.com for an example. Note, this is just a test page,
so do not worry too much about the other problems.

Note that in some of my earlier post some where quick to point out how
stupid I was, but none of them actually could answer my question.

Thank you once more for your reply Richard

- Nicolaas

http://locusmeus.com/html-css/centeringpage.html
Peter

 

[WindAndWaves]

Dear Peter

What my "width height 100%" actually achieves is that the page is centered
in the middle of the page both horizontally and vertically.....

I looked at the web page that you quoted, but this seemed to focus on the
horizontal centering.

 

[Webcastmaker]

Dear Peter

Are you to fucking stupid to pay attention?

 

[The Doormouse]

Having been told off for using height in width in the table, td and
tr tag, can someone please tell me how I can center a page in the
screen?

Content in a table cell is vertically centered by default.
Use of a "div align="center"" tag will center it horizontally.
Totally valid HTML, I think - though you could check the w3C page to be
sure.

There are several ways to do it.

The Doormouse

 

[Hywel]

Are you to fucking stupid to pay attention?

Best leave him be. His brain has.

 

[WindAndWaves]

Dear Doormouse

Thank you for you reply. It is very eays to center something horizontally,
but centering something vertically I find more of a challenge - that is, if
I am not allowed to use 100%.

Check out www.rakau.com to get an idea of what I mean. No matter the size
of the window, the pix is always in the middle.

Note: this may be a very stupid question, but I am a bit stupid (see other
posts). I am sorry for that.

Tia

Kind regards from Aotearoa

- Nicolaas

 

[Clive Moss]

Are you to fucking stupid to pay attention?

Are YOU too f***ing stupid to spell "too" right

Clive

 

[Blinky the Shark]

Are YOU too f***ing stupid to spell "too" right

Damn -- a question mark at the end of that presumed question sure would
have been appropriate. It rarely fails that a syntax/grammar/spelling
flame will itself contain at least one syntax/grammar/spelling error.

 

[Sam Hughes]

Are YOU too f***ing stupid to spell "too" right

I'd like to congratulate you on your spelling and grammar abilities'
superiority! Oh wait, you forgot a question mark.

 

[Toby Inkster]

How can I put this in css????

http://examples.tobyinkster.co.uk/deadcentre

 

[WindAndWaves]

Dear Toby

Thanks a million. Marvellous!

http://examples.tobyinkster.co.uk/deadcentre

 

[Thomas Mlynarczyk]

Also sprach Toby Inkster:

http://examples.tobyinkster.co.uk/deadcentre

But what if one cannot specify an exact height and/or width for the object
to be centered? Width is not the problem, I guess, but height... (if it's
less than window height, center it, if it's more, align top and show
scrollbars)?

 

[Toby Inkster]

Also sprach Toby Inkster:


But what if one cannot specify an exact height and/or width for the object
to be centered? Width is not the problem, I guess, but height... (if it's
less than window height, center it, if it's more, align top and show
scrollbars)?

Depends. Do you want a CSS solution or an Internet Explorer solution?

 

[Thomas Mlynarczyk]

Also sprach Toby Inkster:

Depends. Do you want a CSS solution or an Internet Explorer solution?

Does this question imply that I cannot have both in one? I'd like something
using valid CSS and valid HTML 4.01 Strict (no quirks mode), if possible no
CSS hacks or conditional comments (IE), and it should work fine on IE5+,
NN6+, OP5+, Mozilla and as many other user agents as possible. Can this be
done?

 

[Toby Inkster]

Does this question imply that I cannot have both in one? I'd like something
using valid CSS and valid HTML 4.01 Strict (no quirks mode), if possible no
CSS hacks or conditional comments (IE), and it should work fine on IE5+,
NN6+, OP5+, Mozilla and as many other user agents as possible. Can this be
done?

Using conditional comments, yes, probably. I might have a play with it
tomorrow morning if I can muster the energy.

 

[Toby Inkster]

Using conditional comments, yes, probably. I might have a play with it
tomorrow morning if I can muster the energy.

Argh! It was late last night. I misread your post as "I'd like something
using valid CSS, valid HTML 4.01 Strict (no quirks mode), CSS hacks and
conditional comments".

So I have delivered:
http://examples.tobyinkster.co.uk/deadcentre2

 

[Thomas Mlynarczyk]

Also sprach Toby Inkster:

http://examples.tobyinkster.co.uk/deadcentre2

My IE5.0 refuses to center this vertically and Mozilla 1.1 displays
horizontal and vertical scrollbars and refuses to re-center when the window
size is changed. The horizontal scrollbar is probably the result of the
vertical scrollbar taking up space. With the following modifications,
however, it works (at least on those two browsers, haven't tested the others
yet):

html,body {
height: 100%; width: 100%;
margin: 0; /* added to remove scrollbars on Mozilla */
}
body {
display: table;
}
div {
/* removed "height: 100%", otherwise IE5 won't center verically (why?) */
width: 100%;
text-align: center;
vertical-align: middle;
display: table-cell;
}