Jump to content

[SOLVED] Template CrAzYness

MasterACE14

By MasterACE14
in CSS Help

 Share

Recommended Posts

MasterACE14 Advanced Member

MasterACE14

Posted
Posted

I'm new to CSS and I've made a template, but I've made separate PHP pages for each section of the template, footer, header, leftnav, rightnav etc.

 

for each PHP page, I have linked them to the CSS file that does the whole page layout, but i'm guessing that I should just make separate CSS files for each section. here is my current CSS file that I have linked in every PHP file.

 

/* set margins, padding, and inline-level alignment */
body,div { color: white; margin: 0; padding: 0; text-align: center }

/* set widths and float nav & ads div content boxes */
#nav	{ float: left; width: 100px	}
#ads	{ float: right; width: 100px }

/* set side txt margins 5px > nav & ads widths */
#txt	{ margin-left: 105px; margin-right: 105px }

/* ensure footer stays at the bottom */
#ftr	{ clear: both }

/* show boundaries and set image sizes - for clarity */
#hdr, #ftr	{ background: red				}
#nav, #ads 	{ background: yellow			} 
#txt		{ background: green				}

#hdr img		{ width: 250px; height: 25px	}
#ads img		{ width: 75px; height: 100px	}
#txt img		{ width: 150px; height: 200px	}

 

heres the index.php page:

 

<html>
<head>
<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >
<?php

// Include's
include('variables.php');

?>
<title><?=$gamename?> - Online MMORPG</title>
</head>
<body>
<?php
include('head.php');
?>
<?php
include('leftnav.php');
?>
<?php
include('rightnav.php');
?>
<div id = "txt">
<center>
<?php
	switch ($_GET['page']) {
		default:
		case "home":
			require_once ("lib/home.php");
			break;
		case "page2":
			require_once ("lib/page2.php");
			break;
		case "page3":
			require_once ("lib/page3.php");
			break;
		case "page4":
			require_once ("lib/page4.php");
			break;
	}// end switch
?>
</center>
</div>
<?php
include('footer.php');
?>
</body>
</html>

 

I get everything showing up where it should, but the page is black and white, and the text is the same color as the background of the appropriate section.

 

any ideas?

 

Regards ACE

Link to comment
Share on other sites
MasterACE14 Advanced Member

MasterACE14

Posted
  • Author
Posted

woah, I see what you mean, the source tells you alot more!

 

Source:

 

<html>
<head>
<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >
<meta name = "creator" 
	content = "ACE" >
<meta name = "keywords"
	content = "Online,MMORPG,game,fun,crazy,roleplay" >
<meta name = "description"
	content = "Conflicting Forces is a MMORPG" >
<meta http-equiv = "Content-Type"
	content = "text/html; charset = ISO-8859-1" >
<title>Conflicting Forces - Modern Combat - Online MMORPG</title>
</head>
<body>
<html>
<head>
<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >

<meta name = "creator" 
	content = "ACE" >
<meta name = "keywords"
	content = "Online,MMORPG,game,fun,crazy,roleplay" >
<meta name = "description"
	content = "Conflicting Forces is a MMORPG" >
<meta http-equiv = "Content-Type"
	content = "text/html; charset = ISO-8859-1" ><title>Conflicting Forces - Modern Combat</title>
</head>
<body>

<div id = "hdr">Conflicting Forces - Modern Combat</div>

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

<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >
<meta name = "creator" 
	content = "ACE" >
<meta name = "keywords"
	content = "Online,MMORPG,game,fun,crazy,roleplay" >
<meta name = "description"
	content = "Conflicting Forces is a MMORPG" >
<meta http-equiv = "Content-Type"
	content = "text/html; charset = ISO-8859-1" ><title>Conflicting Forces - Modern Combat</title>
</head>
<body>

<div id = "nav">Navigational Panel</div>

</body>
</html><html>

<head>
<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >
<meta name = "creator" 
	content = "ACE" >
<meta name = "keywords"
	content = "Online,MMORPG,game,fun,crazy,roleplay" >
<meta name = "description"
	content = "Conflicting Forces is a MMORPG" >
<meta http-equiv = "Content-Type"
	content = "text/html; charset = ISO-8859-1" ><title>Conflicting Forces - Modern Combat</title>
</head>
<body>

<div id = "ads">Supplemental Panel</div>

</body>

</html><div id = "txt">
<center>

<meta name = "creator" 
	content = "ACE" >
<meta name = "keywords"
	content = "Online,MMORPG,game,fun,crazy,roleplay" >
<meta name = "description"
	content = "Conflicting Forces is a MMORPG" >
<meta http-equiv = "Content-Type"
	content = "text/html; charset = ISO-8859-1" >Conflicting Forces is Currently in the process of being created, <b>Alpha Testing</b> will begin in a few months. Keep checking back often for updates.





</center>
</div>
<html>
<head>

<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >
<meta name = "creator" 
	content = "ACE" >
<meta name = "keywords"
	content = "Online,MMORPG,game,fun,crazy,roleplay" >
<meta name = "description"
	content = "Conflicting Forces is a MMORPG" >
<meta http-equiv = "Content-Type"
	content = "text/html; charset = ISO-8859-1" ><title>Conflicting Forces - Modern Combat</title>
</head>
<body>

<div id = "ftr"><I>Brought to you by Crikey Games</I></div>

</body>
</html></body>

</html>

 

Regards ACE

Link to comment
Share on other sites
MasterACE14 Advanced Member

MasterACE14

Posted
  • Author
Posted

after a few adjustments to my pages, heres the source for index.php

 

index.php source (browser source) :

 

<html>
<head>
<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >
<meta name = "creator" 
	content = "ACE" >
<meta name = "keywords"
	content = "Online,MMORPG,game,fun,crazy,roleplay" >
<meta name = "description"
	content = "Conflicting Forces is a MMORPG" >
<meta http-equiv = "Content-Type"
	content = "text/html; charset = ISO-8859-1" >
<title>Conflicting Forces - Modern Combat - Online MMORPG</title>
</head>
<body>
<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >

<div id = "hdr">Conflicting Forces - Modern Combat</div>

<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >

<div id = "nav">Navigational Panel</div>

<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >

<div id = "ads">Supplemental Panel</div>

<div id = "txt">
<center>

Conflicting Forces is Currently in the process of being created, <b>Alpha Testing</b> will begin in a few months. Keep checking back often for updates.






</center>
</div>
<link rel = "stylesheet" title = "CF Layout" type = "text/css" href = "css/page-layout.css" >


<div id = "ftr"><I>Brought to you by Crikey Games</I></div>

</body>
</html>

 

Still the colors aren't right, just black and white. heres the link to the page. www.crikeygames.com.au/conflictingforces

 

any ideas?

 

Regards ACE

Link to comment
Share on other sites
Philip Advanced Member

Philip

Posted
Posted

Go ahead and either split it up, or only include the style sheet once otherwise, you have 3 of the same links to your stylesheet inside the BODY area, since you already have it in the HEAD of your document.

 

Also, I don't know what you mean by the colors aren't right, because they are right to what you have in the CSS:

body,div { color: white;[ margin: 1; padding: 0; text-align: center; background: black }

 

 

Link to comment
Share on other sites
  • 2 weeks later...
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.