Website Positioning

S

Si

Hi guys,

OK, so I have a website (www.xcsmessiah.tk) and am currently working on
another for my sister-in-law. Both of these sites have been designed in
Frontpage for 1024 x 768.

However, if you view them at a higher resolution, (my screen at home is 1280
x 1024) the page is NOT centered in the middle of the screen.

I really want the page to always be centered, no matter what resolution you
are using. If you look at (www.xclusivesoldiers.tk), who is a friend of
mine, his website centres in the middle of the screen no matter what
resolution you are using.

I did a bit of research on the web and came across something called CSS - do
I need to use whatever CSS is to make it centre correctly? Or is there an
easy way I can achieve this in Frontpage?

Thanks for your help :)
 
S

Steve Easton

The page is built inside a main "fixed width" "center aligned" table.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer
 
M

Murray

If you are not using absolute positioned elements (i.e., "layers") on your
pages, then the easiest way to center is to put a single cell table on the
page, make the table's alignment be center, and paste the rest of your
content into that single cell.

If you are using absolute positioning (or if you want to do this without
using another table), then you would need to resort to the use of CSS to
center, but it's still quite easy.

Here is a good demonstration -

http://www.roast-horse.com/tutorials/_tutorials/css_centered_content/index.html

And here is some code -

(inline styles used for clarity)

STYLESHEET -
body { text-align:center; } /* for IE5/IE5.5 */
#wrapper { text-align:left; }

BODY -
<div id="wrapper" style="width:760px; top:0; margin:0 auto;
position:relative;">
<div id="layer1" style="width:200px; top: 25px; left:140px;
position:absolute;">blah</div>
<table...></table>
....
</div>

Try that - an outer relatively positioned division with a width and auto
left and right margins. All interior AP divisions, tables, and paragraphs
will be centered, yet retain the
same relative positioning.
 
S

Si

Hi Steve,

I think you've answered my posts before, and although I am grateful for the
help, you aren't particularly helpful to be honest - no offense.

Please be aware that I am no expert and your response does not help me in
any way. If I could please ask you, or anybody else for that matter, to
enlighten me on how to achieve my goal with these websites, that would be
really great.

PS Sorry Steve - no offense intended
 
S

Si

Thats more like it, Murray, thanks for the great feedback.

But, I can't seem to understand this CSS thing. I am using layers so I
tried pating into a cell and it didn't work so like you say, CSS has to be
the way forward but that code you gave me, I pasted it into the "Code"
section of Frontpage and it didn't do anything. Am I missing something here?

Sorry, I am such a newbie when it comes to web design and I told my
sister-in-law I could do her a website and am now beginning to wish I never
had - lol. But if I can crack this little set-back, I think I will be fine
from then on :) (hopefully)
 
S

Steve Easton

Ok, I should have been more "verbose."
;-)

What the author has done, is create a blank page, then create a main table in the page, and then set
the table width at a fixed number of pixels. And then set the table to align center.
This is done in Table properties.
They then place all of the content of the page inside cells which are inside this "main table."

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer
 
M

Murray

Well, my friend, you have serious problems with that page.

As you may know, the structure of any valid and complete HTML page is as
follows -

<html>
<head>
.....
</head>
<body>
.....
</body>
</html>

That is, a defined area for the HTML, a properly terminated head region, and
a properly terminated body region.

Your page is like this -

<html>
<head>
{some xml markup, with IE specific behavior styles}
</head>
<body>
{a layer}
{some paragraphs}
</body>
{more Word Art?}
{more XML}
{some tables}
{more word art, XML, and a lot of other stuff}
</p>

and that's the end.

The first thing you need to do is to get your page's code right. Move the
bottom content into the body area. Get rid of the Word art (it won't be
seen outside of IE/PC anyhow), and then we can tackle the centering.
 
S

Si

Murray - lol - if you don't hate me already, you will do in a minute - I am
such a newbie - sorry.

What do you mean by "Moving the bottom content into the body area"? How do
I do this? DO I cut and paste the code in a certain section?
 
M

Murray

Yes. Cut and paste.

Select everything below </body> (not including this tag), cut it from the
page, and paste it back immediately ABOVE </body>. Now add the </html> tag
below body.

Your final page will now be structured as I outlined below. Check it and
see if it looks the way you want in a preview. Post back with the result.

The next thing you would want to do is to get rid of all the Word Art on the
page. I suppose just selecting it, deleting it, and replacing it with
ordinary text or graphics would be the ticket.

Then we can look at your page again.
 
S

Si

Hey Hey Murray - I have done what you suggested to my index.htm page and
everything looks the same as it did before, which is a relief :)

I have posted the changes to www.xcsmessiah.tk so hit that page and check
the code for yourself if you like.

As far as Wordart goes, there is no Wordart that I know of on this page, I
try and avoid Wordart like the Plague :) ALl I have are a few text boxes
with standard text in them.

Thanks once again for all your great help and I look forward to hearing from
you again soon :)
 
R

Ronx

Text boxes (in fact everything on the drawing toolbar) present the same
problems as word art. They use Absolute Positioning (a potential nightmare
if you do not know how to use AP), and VML graphics which only display in IE
on Windows.
 
M

Murray

That's what I meant - I still am not sure how to tell them all apart.

But whatever, they are a problem on the web.
 
T

Tom J

I'm no expert on web design, but I know when I look at that site with
800 X 600 resolution (40+% of viewers use this) that the opening
message is not readable and half the top menus are scrambled. I know
he said he designed for a different resolution, so no use in
mentioning the scroll bar to view the page.

Tom J
 
M

Murray

Yep - that's the punch line. The page is much too wide for general surfers.
But considering his target audience, it might just be right.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Centered text that does not stay centered 0
Wysiwyg in Word 0
Website is jumbled on my computer only 6
Should I make this website font smaller? 5
Screen Resolution 2
center floating text box on page 2
How to modify resolution of web page? 4
How do i center my webpage 1

Top