Page 1 of 1

how to make work "include a css formatted header & footer"

Posted: Thu Aug 21, 2008 5:39 pm
by freshclearh2o
hello...
I have a css formatted header & footer, but can't seem to get the formatting to pass through include().
I have the header referencing the css using <link rel="stylesheet" type="text/css" href="screenstyle.css" /> which works fine alone but losses formatting when used in include?

Re: how to make work "include a css formatted header & footer"

Posted: Thu Aug 21, 2008 6:38 pm
by dajawu
Can't you just put that in the HTML? I mean why make one line of code, to produce one line of static code? Personally I have my CSS LINK in HTML in a file called header.php which gets included at the top of every page I need formating. If you still need help post our code in case thats the problem.

Al

Re: how to make work "include a css formatted header & footer"

Posted: Thu Aug 21, 2008 6:57 pm
by freshclearh2o
thx for replying...
i should have been more clear. The header file works fine alone but when I send it through an include to make a full page the formatting gets lost?
ex.
<?php include('includes/headerdoc.php') ?>
<!--HTML body has one large table of check boxes for selection -->
<?php include('includes/footerdoc.php') ?>

Re: how to make work "include a css formatted header & footer"

Posted: Thu Aug 21, 2008 7:04 pm
by dajawu
In your header file do you have your link to the CSS sheet as an HTML statement, or are you echoing it out? I am setup just like you with a header and footer on all pages. My header displays the top menu and holds the formating, while the footer cleans stuff up and shows the bottom links. View your source through your browser and see if everything is being put in the right place, and looks correct. I had to do that a few times....

Re: how to make work "include a css formatted header & footer"

Posted: Thu Aug 21, 2008 7:28 pm
by freshclearh2o
seems to put everything in the right spot but with no formatting.. you'll notice that the header is formatted correctly, the footer i need to center, but combining them together, impossible... pls see
<!--header file **********************************************************************-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Localize</title>
<link rel="stylesheet" type="text/css" href="screenstyle.css" />
</head>
<body>
<div class="container">

<div class="titleblock">
<h1><a href="http://www.anthem.com" target="_blank"><img src="../images/Anthem_BC_4C_hires.jpg" border="0" alt="Logo" width="536" height="100" /></a></h1>
<p>&nbsp;</p>
</div>

<div><ul class="navbar">

<li><a href="http://localhost/Mark1/login.php" class="nav">Login</a></li>
<li><a href="http://localhost/Mark1/admins.php" class="nav">About Us</a></li>
<li><a href="#" class="nav">News</a></li>
<li><a href="http://localhost/Mark1/contact_tech.php " class="nav">Contact Us</a></li>
</ul></div>


<!--Footer*******************************************************************************-->
<div id="bottom">
<div class="footer">
<p><cite id="footerText">&reg; Anthem is a registered trademark. &reg; The Blue Cross name and symbol are registered marks of the Blue Cross Association &copy; 2007 Anthem Blue Cross. <br/>
<br/>
Anthem Blue Cross is the trade name of Blue Cross of California. Anthem Blue Cross and Anthem
Blue Cross Life and Health Insurance Company are independent licensees of the Blue Cross Association. </cite></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
</body>
</html>
<!--CSS script ****************************************************************-->
body {
margin:0; padding:0; font-family:verdana, arial, sans-serif; font-size:80%; color:#666666; text-align:center;
background-color:#DDDDDD;}

p {
margin:0.2em 0 1.2em 0; padding:0.3em;}

h1 {
padding:0; margin:0;font-size:250%; font-weight:normal; font-style:italic;
color:#8CD749; font-family:"Trebuchet MS", verdana, arial, sans-serif;}

h2 {
background-color:#DDDDDD; color:#3B4471; font-size:100%; font-weight:normal; margin:0.2em; padding:0;
font-style:italic; font-family:"Trebuchet MS", verdana, arial, sans-serif;}

div {
margin:0; padding:0; display:block;}

a:link, a:visited {
color:#9F6D88; text-decoration:underline;}
a:hover {
color:#3B4471; text-decoration:none;}
a:active {
color:#86A688; text-decoration:underline;}



.container {
background-color:#FFFFFF; margin:0 auto 0 auto; padding:0; width:65%;}

.titleblock {
padding:1em; margin:0; text-align:left;
background-image:url(images/Anthem_BC_4C_hires.jpg);background-repeat:no-repeat; background-position:right center;
}

.titleblock p {
text-indent:2em; color:#3B4471;}



ul.navbar {
list-style-type:none; float:left; display:block; width:100%; line-height:1.5em;
clear:both; margin:0; padding:0; background-color:#999999;}

ul.navbar li {
display:inline;}

a.nav:link, a.nav:visited {
display:block; float:left; width:24.5%; padding:1.2em 0 1.2em 0; margin:0;
text-decoration:none; background-color:#999999; color:#FFFFFF;}

a.nav:hover {
display:block; float:left; width:24.5%; padding:1.2em 0 1.2em 0; margin:0;
text-decoration:none; background-color:#77D088; color:#FFFFFF;}

a.nav:active {
display:block; float:left; width:24.5%; padding:1.2em 0 1.2em 0; margin:0;
text-decoration:none; background-color:#999999; color:#FFFFFF;}



.rightcontainer {
float:right; clear:both; width:13em; margin:1em 0 0 0; padding:0;}

.rightbox {
margin:0.5em; padding:0.3em; border:1px solid #999999; text-align:center;}

.rightcontainer h2 {
text-align:left; padding:0 0 0 1.5em;}

.linkbox a {display:block;}



.content {
clear:left; text-align:left; margin:1.2em 13.5em 0 0; padding:1em 1ex 1em 1.5ex;}

.content h2 {text-indent:3em;}



.footer {
color:#999999; font-size:75%; margin:2.5em 0.2em 0.5em 0.5em; padding:0.8em;
border-top:1px solid #999999; text-align:left; clear:both;}

.footer .right {
float:right; clear:right; text-align:right;}

.footer p {margin:0;}

Re: how to make work "include a css formatted header & footer"

Posted: Thu Aug 21, 2008 7:33 pm
by freshclearh2o
opps i left the link src on the footer pls delete;

Re: how to make work "include a css formatted header & footer"

Posted: Thu Aug 21, 2008 7:59 pm
by dajawu
Oddly enough when I save your code to my computer, and put the css its own file it works fine for me? It looks pretty good too. Is this hosted online, if so give me a link to look at please.

Re: how to make work "include a css formatted header & footer"

Posted: Fri Aug 22, 2008 2:54 pm
by freshclearh2o
im such an idiot... it had to be so easy to resolve my issue that it took me a sleep to figure it out...
issue: css formatting dissappears after sending through include
Solution: (testing from a localhost)
I had my header and footer in my include file along w/ my css;
I moved css file htdocs

Re: how to make work "include a css formatted header & footer"

Posted: Fri Aug 22, 2008 3:00 pm
by freshclearh2o
sry its on our intranet not accessible outside; thx for helping me