Unexpected space between DIV elements - php

my code for the php page displaying the divs
<?php
session_start();
require_once("classlib/mainspace.php");
if (isset($_SESSION['username'])==FALSE) {
header("location:login.php");
}
$user = new User($_SESSION['username']);
?><!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style/style.css" />
<title>SimpleTask - Home</title>
</head>
<body>
<div id="main">
<div id="menu">
<div id="items">
<ul>
<li>home</li>
<li>•</li>
<li>my projects</li>
<li>•</li>
<li>my comments</li>
</ul>
</div>
<div id="user">
<p>Welcome, <?php echo $user->GetRealName(); ?><br/>edit profile • logout</p>
</div>
</div>
<div id="content">
<h1>HOME</h1>
</div>
<div id="footer">
<p>footer text goes here here here here</p>
</div>
</div>
</body>
</html>
and you can find my CSS here http://tasker.efficaxdevelopment.com/style/style.css
and to view the live page go here http://tasker.efficaxdevelopment.com/login.php
username:admin
password:password

Add:
h1,p {
margin:0;
}
Those elements and a few others have margins and paddings by default.

Related

PHP in echo'd HTML

If you're not logged in and don't have the id, the header should include "Inloggen" en "Aanmelden", if one is logged in and has the id, it should show "Uitloggen" which means "Logout". I'm echoing the HTML code, but I also want to run a PHP if else statement in the HTML code.
Header.php:
<?php
echo '<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="../Campingmaasvallei/images/logocamping2.png">
<link rel="stylesheet" href="../Campingmaasvallei/css/reset.css">
<link rel="stylesheet" href="../Campingmaasvallei/css/style.css">
<title>Camping Maasvallei</title>
</head>
<body class="body-login">
<header>
</div>
<div class="container-header">
<img id="logo" src="../Campingmaasvallei/images/logocamping2.png">
<nav>
<li>Home</li>
<li>Omgeving</li>
<?php if (!isset($_SESSION['id'])){
<li>Inloggen </li>
<li>Aanmelden </li>
}
else{
<li>Uitloggen </li>
?>
</nav>
</div>
</header>
<div class="container">';
?>
Insert this code in your file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="../Campingmaasvallei/images/logocamping2.png">
<link rel="stylesheet" href="../Campingmaasvallei/css/reset.css">
<link rel="stylesheet" href="../Campingmaasvallei/css/style.css">
<title>Camping Maasvallei</title>
</head>
<body class="body-login">
<header>
</div>
<div class="container-header">
<img id="logo" src="../Campingmaasvallei/images/logocamping2.png">
<nav>
<li>Home</li>
<li>Omgeving</li>
<?php if (!isset($_SESSION['id'])): ?>
<li>Inloggen </li>
<li>Aanmelden </li>
<?php else:?>
<li>Uitloggen </li>
<?php endif;?>
</nav>
</div>
</header>
<div class="container">'
Try this :
<?php if (!isset($_SESSION['id'])){ ?>
<li>Inloggen </li>
<li>Aanmelden </li>
<?php }else{ ?>
<li>Uitloggen </li>
<?php } ?>

Header extension issue HTML & CSS?

I have a header file which has the navigation menu in it which I include on every page using function (<?php include_once 'header.php'; ?> ). But weirdly some things like my "search" button on pages other then home (index) look differently (I mean header.css dosent work with some elements)!
I will attach screenshots of the home and signup page below so you can see what I mean.
Another "header" releated issue happens when I add tag on the index page (to create side menu) it looks like the css of the "header" although "header" has its own css and index has another one.
Can someone tell me why this is happening! Apparently I cant add images here yet but if you click on teh files below it will open up and you will see what I mean. Thanks
Index page
<?php
include_once 'header.php';
?>
<head>
<title>{{ title }}</title>
<link rel="stylesheet" href="static/index.css">
</head>
<body>
<div class="category-tree">
<h4 class="cat-title">Categories</h4>
<nav>
<ul class="left-menu-categories">
<li class="cat-1">Title</li>
<li class="cat-1">Title</li>
<li class="cat-1">Title</li>
</ul>
</nav>
</div>
</body>
Header file
<?php
session_start();
?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>PHP Project</title>
<link rel="stylesheet" type="text/css" href="static/header.css">
</head>
<body>
<nav>
<img src="static/img/logo.png" href="index.php" style="width: 100px">
<div class="wrapper">
<ul>
<div class="search-bar">
<form>
<input class="search-box" type="text" name="" placeholder="Search...">
<button type="submit" class="button">Search</button>
</form>
</div>
<?php
if (isset($_SESSION["userid"])) {
echo "<li><button class='sell' href=''>Button</button></li>";
echo "<li><a href='profile.php'>My Profile</a></li>";
echo "<li><a href='includes/logout.inc.php'>Log out</a></li>";
}
else {
echo "<li><a href='signup.php'>Sign Up</a></li>";
echo "<li><a href='login.php'>Login</a></li>";
}
?>
</ul>
</div>
</nav>
</body>
<div class="wrapper">
Home page
Home page
Login page
Login page
PHP is a serversided language. Include parses a file server sided into another file befor it is sended to users browser for rendering.
So your document would look like:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>PHP Project</title>
<link rel="stylesheet" type="text/css" href="static/header.css">
</head>
<body>
<nav>
<img src="static/img/logo.png" href="index.php" style="width: 100px">
<div class="wrapper">
<ul>
<div class="search-bar">
<form>
<input class="search-box" type="text" name="" placeholder="Search...">
<button type="submit" class="button">Search</button>
</form>
</div>
<?php
if (isset($_SESSION["userid"])) {
echo "<li><button class='sell' href=''>Button</button></li>";
echo "<li><a href='profile.php'>My Profile</a></li>";
echo "<li><a href='includes/logout.inc.php'>Log out</a></li>";
}
else {
echo "<li><a href='signup.php'>Sign Up</a></li>";
echo "<li><a href='login.php'>Login</a></li>";
}
?>
</ul>
</div>
</nav>
</body>
<div class="wrapper">
<head>
<title>{{ title }}</title>
<link rel="stylesheet" href="static/index.css">
</head>
<body>
<div class="category-tree">
<h4 class="cat-title">Categories</h4>
<nav>
<ul class="left-menu-categories">
<li class="cat-1">Title</li>
<li class="cat-1">Title</li>
<li class="cat-1">Title</li>
</ul>
</nav>
</div>
</body>
to which you surely agree would be an invalid HTML markup. You have multipel <head> and <body> sections.
Your actual files should look like this:
Index.php:
<?php
include_once 'header.php';
?>
<div class="category-tree">
<h4 class="cat-title">Categories</h4>
<nav>
<ul class="left-menu-categories">
<li class="cat-1">Title</li>
<li class="cat-1">Title</li>
<li class="cat-1">Title</li>
</ul>
</nav>
</div>
</body>
</html>
header.php:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>PHP Project</title>
<link rel="stylesheet" type="text/css" href="static/header.css">
</head>
<body>
<nav>
<img src="static/img/logo.png" href="index.php" style="width: 100px">
<div class="wrapper">
<ul>
<div class="search-bar">
<form>
<input class="search-box" type="text" name="" placeholder="Search...">
<button type="submit" class="button">Search</button>
</form>
</div>
<?php
if (isset($_SESSION["userid"])) {
echo "<li><button class='sell' href=''>Button</button></li>";
echo "<li><a href='profile.php'>My Profile</a></li>";
echo "<li><a href='includes/logout.inc.php'>Log out</a></li>";
}
else {
echo "<li><a href='signup.php'>Sign Up</a></li>";
echo "<li><a href='login.php'>Login</a></li>";
}
?>
</ul>
</div>
</nav>

Use PHP to reuse common elements in Website(HTML)

Website contains common elements such as header,navigation bar and footer. How should i re-write html pages so that static HTML elements common to my pages are sourced from the same PHP scripts? Can show me some examples?
Example of my html page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="description" content="example" />
<meta name="keywords" content="HTML5 PHP" />
<meta name="author" content="Detonizer" />
<title>Home</title>
</head>
<body>
<nav>
<p class="menu">page1</p>
<p class="menu">page2</p>
<p class="menu">page3</p>
<p class="menu">page4</p>
<p class="menu">page5</p>
<p class="menu">page6</p>
</nav>
<footer class="footC" >
<p class="e1">Example1</p>
<p class="e2">Example2</p>
<p class="e3">Example3</p>
</footer>
</body>
</html>
Call this header.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="description" content="example" />
<meta name="keywords" content="HTML5 PHP" />
<meta name="author" content="Detonizer" />
<title>Home</title>
</head>
Call this footer.php
<footer class="footC" >
<p class="e1">Example1</p>
<p class="e2">Example2</p>
<p class="e3">Example3</p>
</footer>
In your PHP pages:
<?php include_once 'header.php'; ?>
<body>
<nav>
<p class="menu">page1</p>
<p class="menu">page2</p>
<p class="menu">page3</p>
<p class="menu">page4</p>
<p class="menu">page5</p>
<p class="menu">page6</p>
</nav>
<?php include_once 'footer.php'; ?>
</body>
</html>
You can define an index.php file and include different parts different files like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="description" content="example" />
<meta name="keywords" content="HTML5 PHP" />
<meta name="author" content="Detonizer" />
<title><?php include 'title.php'; ?></title>
</head>
<body>
<nav>
<p class="menu">page1</p>
<p class="menu">page2</p>
<p class="menu">page3</p>
<p class="menu">page4</p>
<p class="menu">page5</p>
<p class="menu">page6</p>
</nav>
<section id="content">
<?php include 'content.php'; ?>
</section>
<footer class="footC" >
<p class="e1">Example1</p>
<p class="e2">Example2</p>
<p class="e3">Example3</p>
</footer>
</body>
</html>

Include html pages in a php file

I would like to create a template using html and css so I created the following template.html 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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Application</title>
<link href="CSS/layout.css" rel="stylesheet" />
<script src=""></script>
</head>
<body>
<div class="wrapper">
<div class="header">
<!--<div class="header_left"></div>
<div class="header_right"> -->
<h3>Application</h3>
<h4>**** Project ****</h4>
</div>
<div class="navbar">
<ul class="mainnavbar">
<li>Home</li>
<li>About</li>
<li>Description</li>
<li>Contact Me</li>
</ul>
</div>
<div class="mainbody">
<div class="leftcol">
<div class="left_navbar">
<ul class="left_inner">
<li>Login</li>
<li>About</li>
<li>Description</li>
<li>Contact me</li>
</ul>
</div>
</div>
<div class="midcol">
Center
</div>
<div class="rightcol">
Right Column
</div>
</div>
<div class="footer">Designed By Me</div>
</div>
</body>
</html>
Because I want to create a dynamic website I want to separate this template.html into index.php, header.php, navbar.php, home.php and footer.php. So I did the following:
index.php
<?php
include("includes/header.html");
include("includes/navbar.html");
include("includes/home.html");
include("includes/footer.html");
?>
header.html
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Application</title>
<link href="CSS/layout.css" rel="stylesheet" />
<script src=""></script>
</head>
<body>
<div class="wrapper">
<div class="header">
<!--<div class="header_left"></div>
<div class="header_right"> -->
<h3>Application</h3>
<h4>****Project ****</h4>
</div>
navbar.html
<div class="navbar">
<ul class="mainnavbar">
<li>Home</li>
<li>About</li>
<li>Description</li>
<li>Contact Me</li>
</ul>
</div>
home.html
<div class="mainbody">
<div class="leftcol">
<div class="left_navbar">
<ul class="left_inner">
<li>Login</li>
<li>About</li>
<li>Description</li>
<li>Contact me</li>
</ul>
</div>
</div>
<div class="midcol">
Center
</div>
<div class="rightcol">
Right Column
</div>
</div>
footer.html
<div class="footer">Designed By me</div>
</div>
</body>
</html>
I have these files in a folder called includes. I just separated the file template.html in 4 html files and then called them from index.php, but I just get a white page when I run index.php in the browsers. Is there something missing?
Your code (syntax and idea with including html) is fine. That should work.
You have to search for problems somewhere else.
Maybe you have a problem with:
web server configuration (virtual hosts, directories etc.)
wrong url / wrong server (refreshing some web server url, but you work on local XAMPP)
file permissions (however apache normally should report error in that case)
Looking at web server error logs may help.
Make sure you aren't just running your template.html just by opening it locally in a browser.
Since PHP is a server side language, you would need to run the page on a live server on a local server such as Apache. WAMP is also a nice tool when locally developing sites that require PHP.
You can also use file_get_contents("path_to_file/file.html") instead of include()
But only if there is HTML content, not PHP

Zend Framework layout or view lag

I have a website built on ZF. I don't know why but is lagging as hell. Loading simple page tooks 4s. Time is going down when I disable layout. When rendering is enabled it's working normally. So I can use action views but I can't use layouts. Can it be someting bad with layout? Or I'm not setting up layout properly?
Site: http://zgarnijlicke.pl
Edit:
I'm adding layout code below:
<<?php ?>?xml version="1.0" encoding="UTF-8"?<?php ?>>
<!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" xml:lang="en" lang="en">
<head>
<link rel="stylesheet" type="text/css" media="screen"
href="<?php echo $this->baseUrl;?>/public/styles/style.css" />
<link rel="stylesheet" type="text/css" media="screen"
href="<?php echo $this->baseUrl;?>/public/styles/menu.css" />
<link rel="shortcut icon"href="<?php echo $this->baseUrl;?>/public/images/favicon.ico">
<script src="<?php echo $this->baseUrl;?>/public/scripts/jquery.js"></script>
<script src="<?php echo $this->baseUrl;?>/public/scripts/jquery.corner.js"></script>
<script src="<?php echo $this->baseUrl;?>/public/scripts/jquery.media.js"></script>
<title><?php echo $this->title . ' - '; echo ($this->cattitle != '') ? $this->cattitle . ' - ' : '';?>Zgarnijlicke.pl</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<div id="naglowek">
<div id="logo"><img src="<?php echo $this->baseUrl;?>/public/images/logo.png" width="338px" height="63px" /></div>
<div id="szukajka">
<div id="szukaj">Szukaj</div>
<div id="poleszukaj"><input name="search" maxlength="20" size="20" value="wpisz cos..." onblur="if(this.value=='') this.value='wpisz cos...';" onfocus="if(this.value=='wpisz cos...') this.value='';" type="text"> </div>
</div>
</div>
<?php echo $this->partial('top_menu1.phtml', array()); ?>
<div class="clear"> </div>
<div id="banner"><img src="<?php echo $this->baseUrl;?>/public/images/banner.png" width="994px" height="212px" />
</div>
<?php echo $this->placeholder('top_menu2'); ?>
<div class="clear"> </div>
<div id="wrapper">
<div id="container">
<div id="side-a">
<div class="widget"><?php echo $this->partial('menu_left_1.phtml', array()); ?></div>
<div class="clear"> </div>
<div class="widget">Lewa strona</div>
</div>
<div id="content">
<div class="content_elem"><?php echo $this->layout()->content; ?></div>
</div>
<div id="side-b">
<div class="widget">Prawa strona</div>
</div>
</div>
<div class="clear"> </div>
<div id="footer">
<img src="<?php echo $this->baseUrl;?>/public/images/stopka.png" width="992px" height="34px" />
</div>
</div>
<script type="text/javascript">
$("#menu_top1").corner();
//$(".widget").corner();
//$("#top_menu2").corner();
//$(".content_elem").corner();
$('a.media').media();
</script>
</body>
</html>
This is impossible to say without any code to review. Do you happen to use the action stack a lot? If so, this is likely the culprit as it goes through the entire dispatch for each call.
Your best bet: use a XDebug or Zend Debugger to find the bottleneck in your application.

Categories