- This topic is empty.
-
AuthorPosts
-
June 20, 2008 at 8:14 am #22805daveMember
hello all, im having a little trouble here. im attempting to use some css scripted called comicgallery at http://www.designmeme.com.
so far this is where im at http://www.davemcclane.com/comicpage/example.php. the imediate issue that i appear to be having is that im unable to display my footer or my background content area.
when i change the example.php file extention to html, it will display the footer. but not as a php file.
i realize i am at a early stage of learning css, nonetheless i would appreciate any sugjections. thanksJune 20, 2008 at 9:30 am #48045ArgeauxParticipantwell if it works as a .html file there is something different in your .php file then in your .html file.
Do a file compare wich checks every line for you for differences. Or post the php source here so i can take a look.June 20, 2008 at 10:24 am #48049daveMemberthanks for the reply, this is the php that i have so far which im trying to modify to my mockup.
when i view the source code from within a browser it fails to show the "footer" and "example" divs, yet below is the php straight from the server which shows it.i will also attach the css file if that will help.
thanks again!<!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>Comic Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="kubrick.css" type="text/css" media="screen" />
<style type="text/css" media="screen">
#example { width: 500px; margin: 0 auto; text-align: center; }
#cg_img { height: 480px; }
#cg_nav1, #cg_nav2 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }
#cg_nav1 a, #cg_nav2 a { text-decoration: none; }
#cg_nav1 a:hover, #cg_nav2 a:hover { text-decoration: underline; }
#cg_credits { font-family:"Courier New", Courier, mono; font-size: 11px; color:#999; }
#cg_credits a { color:#666; text-decoration: none; }
#cg_credits a:hover { text-decoration: underline; }
.cg_arrow1, .cg_arrow2 { font-weight: bold; }
</style>
</head>
<body>
<div id="page">
<div id="header"></div>
<hr />
<div id="example">
<?php include("comicgallery.php"); ?>
</div>
<hr /><div id="footer">
<p><em/> <br/>
<a href="http://binarybonsai.com/kubrick/"> </a></p>
</div></div>
</body>
</html>below is the css kubrick script that im using
/*
Kubrick v1.2.5 for WordPress 1.2
http://binarybonsai.com/kubrick/This theme was designed and built by Michael Heilemann,
whose blog you will find at http://binarybonsai.com/The CSS, XHTML and design is released under GPL:
http://www.opensource.org/licenses/gpl-license.php*** REGARDING IMAGES ***
All CSS that involves the use of images, can be found in the ‘index.php’ file.
This is to ease installation inside subdirectories of a server.Have fun, and don’t be afraid to contact me if you have questions.
*//* Begin Typography & Colors */
body {
font-size: 62.5%; /* Resets 1em to 10px */
font-family: ‘Lucida Grande’, Verdana, Arial, Sans-Serif;
background-color: #d5d6d7;
color: #333;
text-align: center;
}#page {
background-color: white;
border: 1px solid #959596;
text-align: left;
}#header {
background-color: #959596;
}#content {
font-size: 1.2em
}.widecolumn .entry p {
font-size: 1.05em;
}.narrowcolumn .entry, .widecolumn .entry {
line-height: 1.4em;
}.widecolumn {
line-height: 1.6em;
}.narrowcolumn .postmetadata {
text-align: center;
}.graybox {
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}#footer {
background-color: #eee;
}small {
font-family: Arial, Helvetica, Sans-Serif;
font-size: 0.9em;
line-height: 1.5em;
}h1, h2, h3 {
font-family: ‘Trebuchet MS’, ‘Lucida Grande’, Verdana, Arial, Sans-Serif;
font-weight: bold;
}h1 {
font-size: 4em;
text-align: center;
}.description {
font-size: 1.2em;
text-align: center;
}h2 {
font-size: 1.6em;
}h2.pagetitle {
font-size: 1.6em;
}#sidebar h2 {
font-family: ‘Lucida Grande’, Verdana, Sans-Serif;
font-size: 1.2em;
}h3 {
font-size: 1.3em;
}h1, h1 a, h1 a:hover, h1 a:visited, .description {
text-decoration: none;
color: white;
}h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
color: #333;
}h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
text-decoration: none;
}.entry p a:visited {
color: #b85b5a;
}.commentlist li, #commentform input, #commentform textarea {
font: 0.9em ‘Lucida Grande’, Verdana, Arial, Sans-Serif;
}.commentlist li {
font-weight: bold;
}.commentlist cite, .commentlist cite a {
font-weight: bold;
font-style: normal;
font-size: 1.1em;
}.commentlist p {
font-weight: normal;
line-height: 1.5em;
text-transform: none;
}#commentform p {
font-family: ‘Lucida Grande’, Verdana, Arial, Sans-Serif;
}.commentmetadata {
font-weight: normal;
}#sidebar {
font: 1em ‘Lucida Grande’, Verdana, Arial, Sans-Serif;
}small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike {
color: #777;
}code {
font: 1.1em ‘Courier New’, Courier, Fixed;
}acronym, abbr, span.caps
{
font-size: 0.9em;
letter-spacing: .07em;
}a, h2 a:hover, h3 a:hover {
color: #06c;
text-decoration: none;
}a:hover {
color: #147;
text-decoration: underline;
}#wp-calendar #prev a {
font-size: 9pt;
}#wp-calendar a {
text-decoration: none;
}#wp-calendar caption {
font: bold 1.3em ‘Lucida Grande’, Verdana, Arial, Sans-Serif;
text-align: center;
}#wp-calendar th {
font-style: normal;
text-transform: capitalize;
}
/* End Typography & Colors *//* Begin Structure */
body {
margin: 0;
padding: 0;
}#page {
background-color: ;
margin: 20px auto;
padding: 0;
width: 760px;
border: 0px solid #959596;
}#header {
padding: 0;
margin: 0 auto;
height: 200px;
width: 100%;
background-color: #73a0c5;
}#headerimg {
margin: 0;
height: 200px;
width: 100%;
}.narrowcolumn {
float: left;
padding: 0 0 20px 45px;
margin: 0px 0 0;
width: 450px;
}.widecolumn {
padding: 10px 0 20px 0;
margin: 5px 0 0 150px;
width: 450px;
}.post {
margin: 0 0 40px;
text-align: justify;
}.widecolumn .post {
margin: 0;
}.narrowcolumn .postmetadata {
padding-top: 5px;
}.widecolumn .postmetadata {
margin: 30px 0;
}#footer {
padding: 0;
margin: 0 auto;
width: 733px;
clear: both;
height: 136px;
}#footer p {
margin: 0;
padding: 20px 0;
text-align: right;
}
/* End Structure *//* Begin Headers */
h1 {
padding-top: 70px;
margin: 0;
}.description {
text-align: center;
}h2 {
margin: 30px 0 0;
}h2.pagetitle {
margin-top: 30px;
text-align: center;
}#sidebar h2 {
margin: 5px 0 0;
padding: 0;
}h3 {
padding: 0;
margin: 30px 0 0;
}h3.comments {
padding: 0;
margin: 40px auto 20px ;
}
/* End Headers *//* Begin Images */
p img {
padding: 0;
max-width: 100%;
}/* Using ‘class="alignright"’ on an image will (who would’ve
thought?!) align the image to the right. And using ‘class="centered’,
will of course center the image. This is much better than using
align="center", being much more futureproof (and valid) */img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}.alignright {
float: right;
}.alignleft {
float: left
}
/* End Images *//* Begin Lists
Special stylized non-IE bullets
Do not work in Internet Explorer, which merely default to normal bullets. */html>body .entry ul {
margin-left: 0px;
padding: 0 0 0 30px;
list-style: none;
padding-left: 10px;
text-indent: -10px;
}html>body .entry li {
margin: 7px 0 8px 10px;
}.entry ul li:before, #sidebar ul ul li:before {
content: "