...

View Full Version : CSS can I use PHP?



SteveDD
10-28-2008, 08:16 PM
Hi,
I am very new to CSS and have been not long finished designing my website using html and php. I have received feedback in relation to my over use of tables and I have to agree it isnt very good.

I have set out designing the site using CSS but I have ran into a few problems.

1) I have my logo set as a background and at present placed a further picture in my main html file using the (header1) using the CSS to place it near the background logo. Can I add the image directly to the CSS code to avoid me having to keep my html files when my images change. I want it to load when I link to my 'master.css file'

2) Can I put php in the CSS file. On my old site I use to have a 2 columns one which would bring back the latest pictures added and the other the best pictures. if this - represents a picture they were laid out as follows. (lp = latest piture BP = best pictures)
LP BP
- -
- -
- -
- -

Again this is something I wish to load on every page without the need for me to individually add it to each div every page I create.

Is there a way I can add my php code to the css file?
If so how can I stand them side by side, at the minute it just does the following
LP
-
-
-
BP
-
-
-

At the minute I have 3 divs for the side bar one called 'sidebar' (which is the sidebar :) ) and the other 'padding' (padding for the side bar). Would I need to create new divs for each LP and BP to position them or can it be laid out within the main div

Regards,

Steve

BoldUlysses
10-28-2008, 08:34 PM
Is there a way I can add my php code to the css file?

Yes. Here's a tutorial (http://sperling.com/examples/pcss/). Modify as necessary to substitute background image for the example of color used in the tutorial.

SteveDD
10-28-2008, 08:59 PM
Hi thanks for that so I need to put my php variables in a seperate .php file and call upon it on my main page.

However how do I add a value to the example below i.e. say that one of my php columns was called latestpic - how can I make this below php statement called #latestpic so the main file knows what the variable is?


<?php
header("Content-type: text/css");
$color = "green"; // <--- define the variable
echo <<<CSS
/* --- start of css --- */
h2
{
color: $color; /* <--- use the variable */
font-weight: bold;
font-size: 1.2em;
text-align: left;
}
/* --- end of css --- */
CSS;
?>

SteveDD
10-28-2008, 09:10 PM
I don't understand how I substiture the colour things that is throwing me. My php code is


<?php

$sql = "select nnname, picture from onlineprofile where visable = '2' or spare = '2'";
$sql_run = mysql_query($sql, $conn) or die(mysql_error());

$counter==1;
while ($values = mysql_fetch_array($sql_run)) {
$id = $values['id'];
$companyname = $values['nnname'];
$picture = $values['picture'];
$visable = $values['visable'];



echo "<table border=\"0\" width=\"105\" cellspacing=\"2\" cellpadding=\"1\">";
echo "<tr><td><img src=\"{$values['picture']}\" width=\"60\" height=\"30\"></td></tr>";

echo "<tr><td><a href=\"http://www.mysite{$values['companyname']}\"><font face=\"Verdana\" size=\"0\" color=\"#ff6600\">{$values['companyname']}</a></font></td>
</tr></table>";


}
?>

This produce a nnname and a image which is listed. This has the variable called 'latest'. I want this to be displayed on each page also these results contain hyperlinks it isnt just a background.

Also Is there a code to make the two php results to sit next to each other? like
- -
instead of
-
-
-

BoldUlysses
10-28-2008, 09:14 PM
That sounds like more of a layout issue than a scripting issue. Can you post a link to your page or your entire outputted (post-PHP) code?

SteveDD
10-28-2008, 09:56 PM
ok I have my php/css code, master.php



<?php header("Content-type: text/css"); ?>

html, body {
margin: 0;
padding: 0;
}


body {
font-family: Arial, Helvetica, Verdana, Sans-serif;
font-size: 12px;
color: #666666;
background: #ffffff;

}


.hidden {
display: none;
}

h1 {
margin: 0;
padding: 0;
float: right;
margin-top: 70px;
padding-right: 420px;



}


#page-container {

width: 1050px;
margin: auto;
border: all;
border-style: solid



}

#content h2 {
margin: 0;
padding: 0;
padding-bottom: 15px;

}

#content p {
margin: 0;
padding: 0;
padding-bottom: 15px;
}


#header {
margin: 0;
padding: 0;
height: 220px;
background: #db6d16
url(mainlogo.jpg);

}


/* Main Navigation */

#main-nav { height: 50px; }
#main-nav dl { margin: 0; padding: 0; }

/* IE5 Mac Hack \*/
#main-nav { padding-left: 11px; }
/*/
#main-nav { padding-left: 11px; overflow: hidden; }
/* End Hack */

#main-nav dt { float: left; }

#main-nav dt a {
display: block;
height: 0px !important;
height /**/:50px; /* IE 5/Win hack */
padding: 50px 0 0 0;
overflow: hidden;
background-repeat: no-repeat;
}

#main-nav dt a:hover {
background-position: 0 -50px;
}

#main-nav dt#about,
#main-nav dt#about a { width: 71px; background-image: url(about.gif); }

#main-nav dt#services,
#main-nav dt#services a { width: 84px; background-image: url(services.gif); }

#main-nav dt#portfolio,
#main-nav dt#portfolio a { width: 95px; background-image: url(portfolio.gif); }

#main-nav dt#contact,
#main-nav dt#contact a { width: 106px; background-image: url(contact.gif); }

body.about dt#about,
body.about dt#about a,
body.services dt#services,
body.services dt#services a,
body.portfolio dt#portfolio,
body.portfolio dt#portfolio a,
body.contact dt#contact,
body.contact dt#contact a {
background-position: 0 -100px;
}





#sidebar-a {

float: right;
width: 280px;
line-height: 18px;
background: #EAF2FF
}

#sidebar-a .padding {
padding: 25px;
}


#main-nav dt a {
display: block;

}

#content {
margin-right: 280px;
line-height: 18px;

}

#content .padding {
padding: 25px;
}


#footer {
clear: both;
height: 30px;
font-family: Tahoma, Arial, Helvetica, Sans-serif;
font-size: 10px;
color: #c9c9c9;
border-top: 1px solid #efefef;
padding: 13px 25px;
line-height: 18px;
}


#footer a {
color: #c9c9c9;
text-decoration: none;
}

#footer #altnav {
width: 350px;
float: right;
text-align: right;

}


#footer a:hover {
color: #db6d16;
}




my main site index.php


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>CompanyName - PageName</title>
<meta http-equiv="Content-Language" content="en-us" />

<meta http-equiv="imagetoolbar" content="no" />
<meta name="MSSmartTagsPreventParsing" content="true" />

<meta name="description" content="Description" />
<meta name="keywords" content="Keywords" />

<meta name="author" content="Enlighten Designs" />

<style type="text/css" media="all">@import "master.php";</style>
</head>

<body>

<div id="page-container">


<div id="header">
<h1><a href="http://mingle.com/fs-bin/click?id=VAxQVdPz/I8&offerid=163417.10000020&subid=0&type=4"><IMG border="0"
alt="My Site" src="http://ad.comfs-bin/show?id=VAxQVdPz/I8&bids=163417.10000020&subid=0&type=4&gridnum=3">
</a></h1>
</div>

<div id="main-nav"><dl>
<body class="about">
<dt id="about"><a href="#">About</a></dt>
<dt id="services"><a href="#">Services</a></dt>
<dt id="portfolio"><a href="#">Portfolio</a></dt>
<dt id="contact"><a href="#">Contact Us</a></dt>
</dl>
</div>

<div id="sidebar-a">
<div class="padding">
<form method="post" action="divert1.php">

<select name="more">

<?PHP
error_reporting(E_ALL && ~E_NOTICES);

include("data/data.php");
$conn = mysql_connect($servername, $user, $password) or die("Could not connect: " . mysql_error());
mysql_select_db($user, $conn);

$sql="SELECT id, companyname, more FROM onlineoffers where visable = '1' or visable = '2' order by companyname";
$result =mysql_query($sql);
while ($data=mysql_fetch_assoc($result)){
?>
<option value ="<?php echo $data['more'] ?>"><?php echo $data['companyname'] ?></option>
<?php } ?>
</select>
<input type="submit" name="submit" value="Go!" />
<br />

</form>
<div id="latest">
<?php

$sql = "select companyname, picture from onlineoffers where spare = '1'";
$sql_run = mysql_query($sql, $conn) or die(mysql_error());

$counter==1;
while ($values = mysql_fetch_array($sql_run)) {
$id = $values['id'];
$companyname = $values['companyname'];
$picture = $values['picture'];
$spare = $values['spare'];



echo "<table border=\"0\" width=\"105\" cellspacing=\"2\" cellpadding=\"1\">";
echo "<tr><td><img src=\"{$values['picture']}\" width=\"60\" height=\"30\"></td></tr>";

echo "<tr><td><a href=\"http://www.mysite.co.uk/members/companies1.php?companyname={$values['companyname']}\"><font face=\"Verdana\" size=\"0\" color=\"#ff6600\">{$values['companyname']}</a></font></td>
</tr></table>";


}


?>

<?php

$sql = "select companyname, picture from onlineoffers where visable = '2' or spare = '2'";
$sql_run = mysql_query($sql, $conn) or die(mysql_error());

$counter==1;
while ($values = mysql_fetch_array($sql_run)) {
$id = $values['id'];
$companyname = $values['companyname'];
$picture = $values['picture'];
$visable = $values['visable'];



echo "<table border=\"0\" width=\"105\" cellspacing=\"2\" cellpadding=\"1\">";
echo "<tr><td><img src=\"{$values['picture']}\" width=\"60\" height=\"30\"></td></tr>";

echo "<tr><td><a href=\"http://www.mysite.co.uk/members/companies1.php?companyname={$values['companyname']}\"><font face=\"Verdana\" size=\"0\" color=\"#ff6600\">{$values['companyname']}</a></font></td>
</tr></table>";


}


?>
</div>
</div>
</div>


<div id="content">
<div class="padding">
<h2>About</h2>
<p><strong>Enlighten Designs</strong> is an Internet solutions provider that specialises in
front and back end development. To view some of the web sites we have created view our
portfolio.</p>
<p>We are currently undergoing a 'face lift', so if you have any questions or would
like more information about the services we provide please feel free to contact us.</p>

<h2>Contact Us</h2>
<p>Phone: (07) 853 6060<br />
Fax: (07) 853 6060<br />
Email: <a href="mailto:info@enlighten.co.nz">info@lenlighfmfften.co.nz</a><br />
P.O Box: 14159, Hamilton, New Zealand</p>
<p><a href="#">More contact information...</a></p>
</div>
</div>

<div id="footer">
<div id="altnav">
<a href="#">About</a> -
<a href="#">Services</a> -
<a href="#">Portfolio</a> -
<a href="#">Contact Us</a> -
<a href="#">Terms of Trade</a>
</div>
<div id="copyright">
Copyright &copy; My site LTD

Powered by <a href="http://www.mysite.co.uk.com/">Hosting</a> and
<a href="http://www.vadmineed.co.nz/">Vadmin 3.0 CMS</a>
</div>

</div>


</div>

</body>


</html>


I want the three php in the right div 'sidebar-a' to be in my css file so they are loaded. each result brings back a small image and a link.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum