Design problem after upgrade

darkcurves · Post by **darkcurves** » Tue Oct 09, 2007 6:37 pm

Hey, just upgraded my script. It works great actually and very satisfied. I just noticed that the background colour of my website is white instead of the hex code i use after upgrading. I tried changing some lines but that didn't make any difference.

For example , this is my website design:
http://www.keretapi.com/

My guestbook on the other hand only has white background:
http://www.keretapi.com/guestbook/gbook.php

Below are the codes in my header.txt:

Code: Select all

<BODY BGCOLOR="#808098" LEFTMARGIN="0" TOPMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0" ALINK="#D6D6D6" LINK="#808080" VLINK="#808080" TEXT="#000000">

<CENTER>


<TABLE bgcolor="white" CELLSPACING="0" CELLPADDING="0" BORDER="0" WIDTH="800"><TR><TD WIDTH="800"><IMG SRC="http://www.keretapi.com/header.jpg" WIDTH="800" HEIGHT="218"><BR>

<CENTER>
<IFRAME SRC="http://www.keretapi.com/navi/navi.html" TITLE="Navigation" WIDTH="765" HEIGHT="30" SCROLLING="No" FRAMEBORDER="0" ></iframe></CENTER>

</TD>
</TR>

<TR><TD WIDTH="800">

I didnt have this problem with the previous version(1.4). Any help at all will be appreciated. I have to admit that my knowledge in HTML and CSS isn't deep but i suspect this is a CSS problem. Thanks.

Me59 · Post by **Me59** » Wed Oct 10, 2007 4:17 am

looking at the guestbook's source code you have *two* <body> tags where the first is blank. remove that one and it should do...

darkcurves · Post by **darkcurves** » Wed Oct 10, 2007 5:49 am

Which file should i edit to remove the blank <BODY>? Is it gbook.php?

Thanks for replying!

Me59 · Post by **Me59** » Wed Oct 10, 2007 6:07 am

I would remove the <body> tag from your header file and place it in the guestbook.php where the first tag comes from.

you need to search for the tag in that file and just replace/add the *bgcolor* value.

that should do the trick

Henrie · Post by **Henrie** » Wed Oct 10, 2007 4:03 pm

The right way to do it is the following.

Remove the

Code: Select all

<BODY BGCOLOR="#808098" LEFTMARGIN="0" TOPMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0" ALINK="#D6D6D6" LINK="#808080" VLINK="#808080" TEXT="#000000">

line from your header.txt file. The body tag is present in the gbook.php file and as mentioned before it should only be placed ones in your document.

Gbook version 1.5 is xhtml and writing tags is a little strict. However most browsers are very forgiving. But the right way is to do all place all your styling in the style sheet.

Open the style.css in your gbook folder.
find

Code: Select all

body, td {
	color : Black;
	background-color: White; /* NEW IN 1.5 */
	font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-align: left; /* NEW IN 1.5 */
}

and change it to (this replaces the BGCOLOR and *MARGIN styles)

Code: Select all

body {
	color : Black;
	background-color: #808098; /* NEW IN 1.5 */
	font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-align: left; /* NEW IN 1.5 */
	margin: 0px;
}

td {
	color : Black;
	background-color: White; /* NEW IN 1.5 */
	font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-align: left; /* NEW IN 1.5 */
}

Then find

Code: Select all

a {
	color : #0084BE;
	text-decoration : underline;
}

a:hover {
	color : Red;
	text-decoration : none;
}

a.smaller {
	font-size: 10px;
	color : #0084BE;
	text-decoration : underline;
}

a.smaller:hover {
	font-size: 10px;
	color : Red;
	text-decoration : none;
}

and change it to (this replaces all the *LINK colors)

Code: Select all

a {
	color : #808080;
	text-decoration : underline;
}

a:hover {
	color : #D6D6D6;
	text-decoration : none;
}

a.smaller {
	font-size: 10px;
	color : #808080;
	text-decoration : underline;
}

a.smaller:hover {
	font-size: 10px;
	color : #D6D6D6;
	text-decoration : none;
}

That's it. So no need to edit the gbook.php file.

Greetings,
Henrie

Me59 · Post by **Me59** » Wed Oct 10, 2007 8:41 pm

Henrie wrote:The right way to do it is the following...

Henrie, you are implying here that my way is wrong!
My way will work very well but your way is easier to follow

Henrie · Post by **Henrie** » Wed Oct 10, 2007 9:54 pm

helle Me59,

I hope you did not misunderstand me.
Your help was partly correct. You mentioned the removal of the duplicate <body> tag from the header.txt file

The wrong part I was referring to is the use of old html 4.01 attributes.
Gbook since version 1.5 uses the doctype xhtml transitional
In xhtml the bgcolor attribute is depreciated so in this perspective (because you use attributes which are not valid in xhtml) your method is wrong. I just wanted to point that out.

As i wrote in my previous post most browsers are very forgiving, by still parsing the code while the browser knows it is not valid in the declared doctype. So you can use old attributes. But if you want to code according to the W3C standards your described method is 'wrong'. Styling should be done by using style="..." in the body tag or by using css, not by using depreciated attributes like bgcolor. But I know most people are just glad they can write a webpage and they do not even know that it is not valid code according to W3C standards.

Greetings,
Henrie

Me59 · Post by **Me59** » Wed Oct 10, 2007 10:35 pm

Henrie wrote:
The wrong part I was referring to is the use of old html 4.01 attributes.

no offence taken!

sticking to the xhtml books you are correct but in terms of functionality I am not wrong either as it will work as desired

darkcurves · Post by **darkcurves** » Thu Oct 11, 2007 3:29 am

It works! Thanks alot guys!