Clicking on Guestbook moves web page to left

Dr. GBooky is here to help you with your guestbook problems ...
Post Reply
clubamigos99
Posts: 62
Joined: Mon Feb 20, 2006 4:20 pm

Clicking on Guestbook moves web page to left

Post by clubamigos99 »

Script URL:http://www.club-amigos.co.uk/guestbook/gbook.php
Version of script: 1.43
Hosting company: 34sp
URL of phpinfo.php:
URL of session_test.php:
What terms did you try when SEARCHING for a solution:

Write your message below:

For some odd reason when l click on the guestbook it aligns the web page to the left. I am baffled as to why this is.
Any help would be appreciated.
Henrie
Posts: 1095
Joined: Sun Aug 14, 2005 8:57 pm

Post by Henrie »

clubamigos99,

I have had this problem also when i tried to center a div.
In your case you have center-aligned you <div id="wrapper"> by using margin:5px auto;.
Unfortunately Internet Explorer does not interpret the css correctly depending on which doctype is declared in the page.
Compare the page to your other pages to see what difference there is in the doctype.

As a workaround you can add the following style to your body tag in the css:

Code: Select all

text-align: center;
This way your "wrapper" div also gets centered in internet explorer

Greetings,
Henrie
clubamigos99
Posts: 62
Joined: Mon Feb 20, 2006 4:20 pm

Alignment of guestbook

Post by clubamigos99 »

Hello,

This works fine, except l have a few spaces to the right of the word "Contact" on the nav bar when l click on the guestbook. Have you any idea as to the cause of this?
Henrie
Posts: 1095
Joined: Sun Aug 14, 2005 8:57 pm

Post by Henrie »

If the spacing wasn't there before it is introduced by the adding of text-align: center;

I think you had this problem also befor adding text-align: center;
The problem is the result of the wrong box-model interpretation by IE. Width's of border and margins and paddings are added to the width of the element in IE6 and higher and subtracted in IE5.

For your page I have two solutions, you choose which one you want to use.

Solution 1
Change gbook.php file.
Find the following line:

Code: Select all

echo '<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
and replace it with:

Code: Select all

echo '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">
This will force IE6 and later to use Standards compliant mode and therefor interpret the box-model correct. See this page for an explanation http://msdn.microsoft.com/workshop/auth ... octype.asp

Solution 2
Solution 1 is the correct way to go.
For IE 5 method 1 does not work (This is what i read, I can't test is as I have this version not installed). I even don't know if the wrong display is present in IE 5 or not.
A solution for IE 5 is (can also be used in IE 6 by changing IE 5 to IE 6):
Add

Code: Select all

<!--[if IE 5]>
<style type='text/CSS'>
<!--
#navcontainer li a {width: 95px;}
//-->
</style>
<![endif]-->
In your header.txt file between
<link href="http://club-amigos.co.uk/guestbook/style.css" rel="stylesheet" type="text/css" />
and
</head>

Greetings,
Henrie
clubamigos99
Posts: 62
Joined: Mon Feb 20, 2006 4:20 pm

Post by clubamigos99 »

Hello,

I tried using solution 2 as per your instructions but still in IE view l get a gap to the right of the word "Contact" on the nav bar.

Any ideas as to how l resolve this issue?
Henrie
Posts: 1095
Joined: Sun Aug 14, 2005 8:57 pm

Post by Henrie »

Why have you not tried solution 1?

The way you have implemented it now, it only works for Internet Explorer 5. Please check which version of Internet Explorer you use.
To use method 2 for Internet Explorer 6 you have to change IE 5 to IE 6 as mentioned in my previous post (this way it will stop working for IE 5, so to enable it for both IE versions you will have to add it twice or change [if IE 5] the code so that it applies for versions 5 and 6)

I suggest also implementing solution 1 because all newer Internet Explorer versions will have the problem and solution 1 is a solution for all these newer versions.

Greetings,
Henrie
clubamigos99
Posts: 62
Joined: Mon Feb 20, 2006 4:20 pm

Post by clubamigos99 »

Guestbook is working fine now, many many thanks for your help, it is much appreciated.
Post Reply