web site off center (Full Version)

FrontPage Talk - Great Talk About Microsoft FrontP: http://www.frontpagetalk.com/forums/
- FrontPage Talk Forums: http://www.frontpagetalk.com/forums/default.asp?catApp=0
- - Critique My Site: http://www.frontpagetalk.com/forums/appid_26/tt.htm



Message


Adam Keller -> web site off center (7/3/2008 4:16:54 PM)

Could someone please take a look at a couple of my pages and give me some suggestions as to how to get things more centered? On my 2 different laptops everything looks fine, but on monitors that are more square, the middle of the page is off. Please keep in mind Im not a wiz with this program so dont be afraid to dumb it down for me!

Thanks
Adam
http://www.adamkellerphotography.com/keller.htm
http://www.adamkellerphotography.com/whitaker.htm




newseed -> RE: web site off center (7/5/2008 6:35:37 AM)

You using position: abosolute; in many parts of your code and that will cause the contents to be place exactly where you have coded. For example:

According to your keller.htm page...

<DIV style="position:absolute;left:433px;top:523px;width:575px;height:25px;z-index:2" align="left">

This will place the beginning of bottom menu at 523 pixels from the top of whatever monitor screen resolution and 433 pixels from the left. So if someone is looking at your website with their screen resolution set for 1600px wide, it might look find but for those that have it set for 1028px wide it will look off center.

Secondly, on that same page, you've used spaces (keyboard space bar) to place your logo image to the center of page which is a bad practice.

There are few other issues such as pixelated logo image. The slideshow: it's forcing users to run an Active script that is unknown to most people to view it. More than likely most people will probably not load or download it. The place where you order pictures is really not from the same source and is very cheesy looking which may not impress new comers thus losing possible clients.




Adam Keller -> RE: web site off center (7/6/2008 1:24:40 PM)

Thanks I appreciate the info although can you tell me how to fix it? I understand what you mean about the absolute position, however I dont know how to correct it?
Any help would be super.
Thanks again




newseed -> RE: web site off center (7/7/2008 6:39:55 AM)

It's going to depend on you. I can provide a clean standard code that will center your page regardless of screen/resolution size but are you going to do everything using FP's WYSIWYG editor? If so, then the code I was to give you will probably be useless because it will end up getting messed up again.

WYSIWYG is discouraged these days due to many different kinds browsers which many of those are not becoming standard compliant thus one must learn how to code correctly so that it meets W3.org standards. Even then, in some cases, you will have to use some coding techniques to help fix certains issues so that your site's pages render perfectly.

CSS will help style everything for you thus keeping your HTML code very clean and consistant.

With CSS, you can take this part of your code:

quote:

<p align="center"> <DIV style="position:absolute;left:433px;top:523px;width:575px;height:25px;z-index:2" align="left">
<B>
<FONT style="font-size:21px" color="#C0C0C0" face="Arial Narrow">
<a style="color: #C0C0C0" href="index.htm">HOME</a>      
<a style="color: #C0C0C0" href="Galleries.htm">GALLERIES</a>      
<a style="color: #C0C0C0" href="page2.html">ABOUT</a>      
<a style="color: #C0C0C0" href="page3.html">CONTACT</a></FONT><FONT style="font-size:21px" color="#C0C0C0" face="Arial"> <A href="./page3.html"><span style="text-decoration: none"> 
</span></A> </FONT></B></DIV>


...and turn it into this....

quote:

<DIV id="menu">
<a href="index.htm">HOME</a>
<a href="Galleries.htm">GALLERIES</a>
<a href="page2.html">ABOUT</a>
<a href="page3.html">CONTACT</a>
</DIV>


All the styles that was within the HTML are now moved to a CSS file that links to it. See CSS styles:

quote:

#menu {text-align: center;}
#menu a {font-size:21px; color:#C0C0C0; font-family:"Arial Narrow";}
#menu a:hover {text-decoration: none;}


FrontPage does not do this automatically which is why you need to learn HTML and CSS. Expression Web is an upgrade to FP which has far better support in coding web pages and CSS but it still helps to know the basic of HTML and CSS because no html editor can do it perfectly or correctly.

Now if you decide that you don't have the time or patience to learn HTML and CSS, then I suggest you use tables to place all your contents in and center that table.

Still, you are going to have issues because of the many different browsers and screen resolutions types.




John in Ca. -> RE: web site off center (8/3/2008 10:08:26 PM)

That sounds like really great advice.

Can you tell me what the advantages of an upgrade to Expression Web would be ? I did watch the video at
http://www.microsoft.com/expression/products/Overview.aspx?key=web#page-top

Interested in your opinion .


Thanks for taking the time to answer.




John in Ca. -> RE: web site off center (8/5/2008 2:22:09 PM)

I actually downloaded the Trial Software and can see the differences between FrontPage and Expression web very quickly. Looks like the upgrade will be well worth the price...




Page: [1]

Valid CSS!




Forum Software powered by ASP Playground Advanced Edition 2.0.5
Copyright © 2000 - 2003 ASPPlayground.NET