I'm trying to build an agenda website in php, have downloaded a free css, I have done all the necessary implementations on the index page , i mean have included som php scripts. When i load it from my browser it doesn't show the design, i mean the technical changes appear but not the css, no background images, menu background. Is there any compatibility error or what?
Any changes i make in the css file, doesn't show in the browser.
pucivogel 0 Newbie Poster
rotten69 20 Posting Whiz
Make sure you add the link to the CSS file. Show us your index page so we know what's exactly going wrong.
JorgeM 958 Problem Solver Team Colleague Featured Poster
If the site is online, you can provide us with the URL. That will be sufficient to inspect your code.
pucivogel 0 Newbie Poster
<?php
header('Content-type: text/html; charset=utf-8');
/* Auto load function for missing classes */
/* Check whether there is already an agenda installed, if not, move to the install script. */
// TODO install detection could be done better
if (!file_exists('config.inc.php')) {
header('Location: install.php');
}
include ('auth/include/session.inc.php');
if (!$session->logged_in && !$allowGuestAccess) {
header('Location: login.php');
die();
}
// config.inc.php should be included by now
$dbNew = new DB($dbhost, $dbuser, $dbpass, $dbname);
include ('lang/lang.inc.php');
if (isset ($_SESSION['current'])) {
$current = $_SESSION['current'];
} else {
$now = time();
$current = mktime(0, 0, 0, date("m", $now), date("d", $now), date("Y", $now));
$_SESSION['current'] = $current;
}
/*
* Rest of the includes
*/
include ('includes/functions.inc.php');
include ('includes/monthtable.inc.php');
include ('adodb/adodb.inc.php');
$db = ADONewConnection('mysql');
$db->Connect($dbhost, $dbuser, $dbpass, $dbname);
$db->debug = false;
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Axhenda</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="default.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<!-- start header -->
<div id="header">
<h1>Axhende</a></h1>
</div>
<!-- end header -->
<!-- star menu -->
<div id="menu">
<ul>
<li class="current_page_item"><a href="index2.php">Kreu</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Photos</a></li>
<li><?php if ($session->isAdmin()) {
echo ' <a href="auth/admin/admin.php">Admin Center</a>';
}
?></li>
<li><?php if ($session->logged_in) {
echo ' <a href="auth/process.php">' . $lang['logout'] . '</a>';
} ?></li>
</ul>
</div>
<!-- end menu -->
<!-- start page -->
<div id="page">
<!-- start content -->
<div id="content">
<div class="post">
<div class="title">
<h2>Shto nje event te ri</h2>
</div>
<div class="box">
<?php
if ($session->logged_in) {
include ('includes/addevent.inc.php');
}
?>
</div>
</div>
`So this is the index file, (up to where i'm interested, i haven't posted the whole code of index.
Below is the default. css
body {
margin: 0;
padding: 0;
background-color:#66CCFF;
background-repeat:repeat-x;
font: 13px Georgia, "Times New Roman", Times, serif;
}
form {
margin: 0;
padding: 0;
}
fieldset {
margin: 0;
padding: 0;
border: none;
}
input, textarea {
font: normal 1em Georgia, "Times New Roman", Times, serif;
}
h1, h1 a, h2, h2 a, h3, h3 a {
margin: 0;
text-decoration: none;
color: #333333;
}
h1 {
letter-spacing: -2px;
font-size: 3.2em;
}
h2 {
letter-spacing: -1px;
font-size: 2em;
}
h3 {
margin-bottom: 1em;
font-size: 1em;
}
p, ol, ul {
margin: 0 0 2em 0;
line-height: 200%;
}
blockquote {
margin: 0 0 0 2.5em;
padding-left: 1em;
border-left: 5px solid #16B1B0;
}
a {
color: #16B1B0;
}
a:hover {
text-decoration: none;
}
images {
border: none;
}
/* Header */
#header {
width: 770px;
height: 100px;
margin: 0 auto;
}
#header h1, #header p {
margin: 0;
}
#header h1 {
float: left;
padding: 34px 0 0 0;
}
#header p {
float: right;
padding: 42px 0 0 0;
font-size: 1.8em;
}
#header a {
text-decoration: none;
color: #333333;
}
/* Menu */
#menu {
width: 770px;
height: 65px;
margin: 0 auto;
background: url(images/img02.jpg) no-repeat;
}
#menu ul {
margin: 0;
padding: 7px 0 0 0;
list-style: none;
}
#menu li {
display: inline;
}
#menu a {
padding-right: 30px;
text-decoration: none;
letter-spacing: -1px;
font-size: 1.2em;
font-weight: bold;
color: #333333;
}
#menu a:hover {
text-decoration: underline;
}
/* Page */
#page {
width: 770px;
margin: 0 auto;
background: url(images/img05.gif);
}
#extra {
background: url(images/img06.gif) no-repeat left bottom;
}
/* Content */
#content {
float: left;
width: 530px;
background: url(images/img03.gif) no-repeat;
}
.post {
padding: 40px 40px 0 40px;
}
.post ol, .post ul {
list-style-position: inside;
}
.post .title {
}
.post .title h2 {
}
.post .title p {
}
.post .title p a {
}
.post .entry {
}
.box {
margin: 0.6em 0.6em 0.3em 0.6em;
padding: 0.6em 0.6em 0.6em 0.6em;
background-color: transparent
border: solid 1px '#ccc'
-moz-border-radius: 8px 8px 8px 8px;
}
.post .links {
padding: 2px 20px;
background: #CDFAFB;
text-align: right;
}
.post .links a {
text-decoration: none;
font-weight: bold;
color: #0B8785;
}
.post .links a:hover {
text-decoration: underline;
}
.post .links .more {
}
.post .links .comments {
}
/* Sidebar */
#sidebar {
float: right;
width: 240px;
background: url(images/img04.gif) no-repeat;
}
#sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
#sidebar li {
}
#sidebar li ul {
padding: 20px;
}
#sidebar li li {
font-size: .85em;
}
#sidebar h2 {
height: 33px;
padding: 4px 0 0 10px;
background: url(images/img07.jpg) no-repeat;
font-size: 1.6em;
}
/* Search */
#searchform {
padding: 20px;
}
#search h2 {
background: url(images/img08.jpg) no-repeat;
}
#search #x {
}
#search #s {
width: 120px;
}
#search br {
}
/* Calendar */
#calendar_wrap {
padding: 20px 25px 20px 20px;
}
#calendar table {
width: 100%;
background: #FFFFFF;
border: 1px solid #16B1B0;
text-align: center;
}
#calendar thead {
background: #16B1B0;
color: #FFFFFF;
}
#calendar tbody td {
background: #FFFFFF;
border: 1px solid #BCF8FA;
}
#calendar #prev {
text-align: left;
}
#calendar #next {
text-align: right;
}
#calendar tfoot a {
text-decoration: none;
font-weight: bold;
}
#calendar #today {
background: #BCF8FA;
border: 1px solid #16B1B0;
font-weight: bold;
color: #16B1B0
}
/* Footer */
#footer {
clear: both;
width: 950px;
margin: 0 auto;
padding: 30px 0;
background: url(images/img11.gif) no-repeat;
}
#footer p {
margin: 0 0 5px 0;
text-align: center;
line-height: normal;
font-size: .9em;
}
#footer a {
text-decoration: none;
}
pucivogel 0 Newbie Poster
I want it to be like this : http://images.all-free-download.com/free-website-templates-preview/news_print_227/
I'm using wamp. What i get on chrome is very plain, the menu bulleted, vertically, then the add event box, the wholebackground white.
JorgeM 958 Problem Solver Team Colleague Featured Poster
In line 47 of your code, you reference the external style sheet. Is this the correct name you saved your CSS file as, and also you indicate that the style sheet is in the same folder location as your index.html file. Is that correct?
pucivogel 0 Newbie Poster
yes, that's right.
JorgeM 958 Problem Solver Team Colleague Featured Poster
Ok, I missed the fact that you have starting comment tags on line #38. I took the information you had and tried to rebuild an HTML file and when the comments tags are removed, your page is styled.
If you have this online, it is easier for others to help you debug the HTML, CSS, and JavaScript portions because we can then see the actual HTML output from the web server.
pucivogel 0 Newbie Poster
Omg! thank you so much. Can't believe it wouldn't run properly just for that little thing.
DDarren 0 Newbie Poster
Be a part of the DaniWeb community
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.