Okay so I have found after some long research a code that I will include here that adds prev/next url at bottom of page. What I am doing is making a portfolio that in the future I will add pages and remove, so I needed a php code that would run pages using the footer.php and go to next in line. Example it would show page1.php, page2.php, page3.php, page4.php and so on. That all works great in the code I have. What I would like now is to put a variable name on each page of what that portfolio piece will be then have it echo next to the previous and next button. I can get it to work, but it shows the existing name on each prev/next button.
If I am not making sense just tell me and I will explain it differently. I hope someone can help, been trying to get my portfolio done for some time now! :)
Here is my header.php
<html>
<head>
<title>PAGINATION TEST</title>
<link rel="stylesheet" type="text/css" href="./css/style.css" />
</head>
<nav>
<div id="nav_menu">
<ul>
<li>HOME</li>
<li>ABOUT</li>
<li>CONTACT</li>
</ul>
</div>
</nav>
<body>
Here is my page1.php
<?php //THIS IS THE PREVIOUS/NEXT LINK TITLE FOR EACH PORTFOLIO PAGE
session_start();
$_SESSION['link-title'] = "wonder woman";
?>
<?php include('header.php') ?>
<div id="main_body">
PAGE 1
</div>
<?php include('footer.php') ?>
Here is my footer.php
<?php
session_start(); //this NEEDS to be at top of the page before any output etc
?>
<?php
$pinfo = pathinfo($_SERVER["SCRIPT_FILENAME"]);
$reqpath = dirname($_SERVER["REQUEST_URI"]);
$linkname = ($_SESSION['link-title']);
if(preg_match("/(.*?)(\d+)\.php/", $pinfo["basename"], $matches)) {
$fnbase = $matches[1];
$fndir = $pinfo["dirname"];
$linkTitle = $linkname;
$current = intval($matches[2]);
$next = $current + 1;
$prior = $current - 1;
$next_file = $fndir . DIRECTORY_SEPARATOR . $fnbase . $next . ".php";
$prior_file = $fndir . DIRECTORY_SEPARATOR . $fnbase . $prior . ".php";
$next_link = $linkTitle . $next;
$prev_link = $linkTitle . $prior;
if(!file_exists($next_file)) $next_file = false;
if(!file_exists($prior_file)) $prior_file = false;
if($prior_file) {
$link = $reqpath . DIRECTORY_SEPARATOR . basename($prior_file);
// echo "Prior";
}
if($prior_file && $next_file) {
// echo " / ";
}
if($next_file) {
$link = $reqpath . DIRECTORY_SEPARATOR . basename($next_file);
// echo "Next";
}
if($prev_link) {
$prevTitle = $prev_link;
}
if($next_link) {
$Title = $next_link;
}
}
?>
<div id="pagination_container">
<div id="previous_link">
<!-- PREVIOUS -->
<?php if($prior_file) {
$link = $reqpath . DIRECTORY_SEPARATOR . basename($prior_file);
echo "PREVIOUS";
// echo $_SESSION['link-title'];
echo $prevTitle;
}
?>
</div>
<div id="next_link">
<!-- NEXT -->
<?php if($next_file) {
$link = $reqpath . DIRECTORY_SEPARATOR . basename($next_file);
echo $Title;
// echo $_SESSION['link-title'];
echo "NEXT";
}
?>
</div>
</div>
<div id="footer">
copyright blah blah
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</body>
</html>
here is my css
body,html {
padding: 0;
margin: 0;
overflow-x: hidden;
}
#nav_menu {
background-color: pink;
width: 100%;
height: 80px;
}
#nav_menu ul {
text-align: right;
}
#nav_menu li {
list-style-type: none;
display: inline-block;
padding-right: 20px;
padding-top: 30px;
}
#main_body {
width: 100%;
background-color: #dbdbdb;
height: 400px;
padding: 20px;
color: #333333;
}
#pagination_container {
width: 100%;
background-color: pink;
display: flex;
}
#previous_link {
width: 50%;
background-color: purple;
color: white;
display: flex;
float: left;
text-align: left;
padding-top: 50px;
padding-bottom: 50px;
padding-left: 20px;
}
#previous_link:hover {
color: white;
transition: 0.5s all;
}
#previous_link:link {
color: white;
text-decoration: none;
}
#next_link {
width: 50%;
background-color: purple;
color: white;
text-align: right;
padding-top: 50px;
padding-bottom: 50px;
padding-right: 20px;
border-left: 1px solid #dbdbdb;
}
#next_link a:visited {
color: white;
}
#next_link a:link {
color: white;
text-decoration: none;
}
#next_link a:hover {
color: blue;
transition: 0.5s all;
}
#next_link:hover {
background-color: pink;
transition: 0.5s all;
}
#footer {
text-align: center;
padding-top: 20px;
}
Here is page2.php for example of how it works now
<?php //THIS IS THE PREVIOUS/NEXT LINK TITLE FOR EACH PORTFOLIO PAGE
session_start();
$_SESSION['link-title'] = "superman";
?>
<?php include('header.php') ?>
<div id="main_body">
PAGE 2
</div>
<?php include('footer.php') ?>
Related
I am currently making a bio section for a website and so far I have a way to "edit the profile". What I want to happen is the text that is inserted be saved into a file I have already created. Here's the current code that I have with their according names.
Profile Editing Page (editprofile.php)
<?php
session_start();
if (!isset($_SESSION['username'])) {
$_SESSION['msg'] = "You must log in first";
header('location: login.php');
}
if (isset($_GET['logout'])) {
session_destroy();
unset($_SESSION['username']);
header("location: login.php");
}
$username = $_SESSION['username'];
$file = "extra/" . $username . ".png";
if (!file_exists($file))
$file = 'extra/defaultProfile.png';
?>
<html>
<title> Home Page </title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<header>
<div class="container">
<nav>
<ul>
<li>Home</li>
<li>Downloads</li>
<li>Chat</li>
<li>Profile</li>
<li class="logout">Logout</li>
</ul>
</nav>
</div>
</header>
<body>
<div class="profileimg">
<img src=<?php echo $file; ?> width="125" height="125">
</div>
<div class="profilename">
<p style="position: absolute; top: 8px; left: 130px; color: white; font-size: 30px;"><?php echo $username ?></p>
</div>
<div class="biotext">
<textarea style="position: absolute; top: 75px; left: 132.5px; width: 450px; height: 87px;"></textarea>
</div>
</body>
<footer>
<div class="status">Currently logged in as <?php echo $username ?></div>
</footer>
</html>
The Display Profile Page (profile.php)
<?php
session_start();
if (!isset($_SESSION['username'])) {
$_SESSION['msg'] = "You must log in first";
header('location: login.php');
}
if (isset($_GET['logout'])) {
session_destroy();
unset($_SESSION['username']);
header("location: login.php");
}
$username = $_SESSION['username'];
$file = "extra/" . $username . ".png";
if (!file_exists($file))
$file = 'extra/defaultProfile.png';
?>
<html>
<title> Home Page </title>
<link rel="stylesheet" type="text/css" href="css/main.css">
<header>
<div class="container">
<nav>
<ul>
<li>Home</li>
<li>Downloads</li>
<li>Chat</li>
<li>Profile</li>
<li class="logout">Logout</li>
</ul>
</nav>
</div>
</header>
<body>
<div class="profileimg">
<img src=<?php echo $file; ?> width="125" height="125">
</div>
<div class="profilename">
<p style="position: absolute; top: 8px; left: 130px; color: white; font-size: 30px;"><?php echo $username ?></p>
</div>
<div class="biotext">
<iframe width=25% height=9.5% src="getbio.php" background-color='white' style=" position: absolute; top: 75px; left: 132.5px;"></iframe>
</div>
<p>Edit Your Profile</p>
</body>
<footer>
<div class="status">Currently logged in as <?php echo $username ?></div>
</footer>
</html>
The Part to get the bio text from a file (getbio.php)
<?php
session_start();
if (!isset($_SESSION['username'])) {
$_SESSION['msg'] = "You must log in first";
header('location: login.php');
}
if (isset($_GET['logout'])) {
session_destroy();
unset($_SESSION['username']);
header("location: login.php");
}
$username = $_SESSION['username'];
$bioFile = "bio/" . $username . ".txt";
if (!file_exists($bioFile))
$bioFile = 'bio/defaultBio.txt';
?>
<style>body {background-color: #f1f1f1;}
</style><body><?php echo nl2br( file_get_contents($bioFile) );
?></body>
CSS (main.css)
body {
margin: 0;
background: #222;
font-family: arial;
font-weight: 500;
}
.container {
width: 100%;
margin: 0 auto;
}
header {
background: #55d6aa;
}
header::after {
content: '';
display: table;
clear: both;
}
nav {
float: left;
width: 100%;
}
nav ul {
margin: 0;
padding: 0;
list-style: none;
}
nav li {
display: inline-block;
margin-left: 70px;
padding-top: 10px;
padding-bottom: 10px;
position: relative;
}
nav a {
color: #444;
text-decoration: none;
text-transform: uppercase;
font-size: 14px;
}
nav li:hover {
color: #000;
}
nav li::before {
content: '';
display: block;
height: 5px;
background-color: #444;
position: absolute;
top: 0;
width: 0%;
transition: all ease-in-out 250ms;
}
nav li:hover::before {
width: 100%;
}
.logout {
float: right;
margin-right: 50px;
}
.status {
position: absolute;
bottom: 5px;
right: 5px;
color: green;
}
.download {
display: inline-block;
text-decoration: none;
list-style: none;
}
.download a{
color: lime;
text-decoration:none;
padding-left: 50px;
}
.download a:hover{
color: green;
text-decoration:none;
}
.download li {
display: inline;
float: right;
padding-top: 17.5px;
}
The CSS is just for good viewing of the website and the other parts are for reference. I'm not sure how to save the text from the textarea (part of the editprofile.php) to files inside a folder called /bio. If anyone can help me, I'd be really thankful.
What is missing from your code is a way to send the data entered on the edit page to the server for processing and saving. Obviously, you cannot open a file that has not been created.
The html element used to send data to a server is <form> which interacts with editing (input) elements such as <textarea>.
I suggest some learning on your part. Here is one place to start.
I have a question about styling php with css. In the code below is a navigation bar at the top of the page and it will include the page you selected. In the bottom code is how i prefer the layout, but i just can't get it to work for the php code. It is working atm but it is just text with a link color. i can't make a list like in the second code cause it is in a foreach loop.
How can i get the result i want?
Thanks in advance!!
<head>
<title>Website</title>
<style>
body {margin:0;}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #111;
}
.active {
background-color: #4CAF50;
}
</style>
</head>
<body>
<?php
// This is your menu
$items = array("pagina1", "pagina2", "pagina3", "pagina4");
foreach ($items as $item)
{
if (isset($_GET['page']) && $_GET['page'] == $item)
{
echo ' ' . $item . '';
$activePage = $item . ".php";
}
else
{
echo ' ' . $item . '';
}
}
// Include your page
if (isset($activePage))
{
include $activePage;
}
else
{
include "pagina1.php";
}
?>
</body>
-
<head>
<style>
body {margin:0;}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
}
li
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #111;
}
.active {
background-color: #4CAF50;
}
</style>
</head>
<body>
<ul>
<li><a class="active" href="#home">Home</a></li>
<li>News</li>
<li>Contact</li>
<li>About</li>
</ul>
<div style="padding:20px;margin-top:30px;background- color:#1abc9c;height:1500px;">
<h1>Fixed Top Navigation Bar</h1>
<h2>Scroll this page to see the effect</h2>
<h2>The navigation bar will stay at the top of the page while scrolling</h2>
<p>Some text some text some text some text..</p>
<p>Some text some text some text some text..</p>
<p>Some text some text some text some text..</p>
</div>
</body>
You did not added ul and li tags.
echo '<ul>';
foreach ($items as $item)
{
echo '<li>';
if (isset($_GET['page']) && $_GET['page'] == $item)
{
echo ' ' . $item . '';
$activePage = $item . ".php";
}
else
{
echo ' ' . $item . '';
}
echo '</li>';
}
echo '</ul>';
You're not adding the ul structure.
<ul>
<?php
// This is your menu
$items = array("pagina1", "pagina2", "pagina3", "pagina4");
foreach ($items as $item)
{
if (isset($_GET['page']) && $_GET['page'] == $item)
{
echo '<li> ' . $item . '</li>';
$activePage = $item . ".php";
}
else
{
echo '<li> ' . $item . '</li>';
}
}
?>
</ul>
Before you begin your foreach loop, add echo "<ul>";.
Change the echo within the loop to begin with <li> and end with </li>.
Lastly, after your foreach loop, add echo "</ul>";.
I'm developing an application that contains a table made by div. The divs are filled according to the results database.
As you can see in the image below.
However, if I put one more item on the bench, just disrupting the entire table. What I would do is to put a rod horizontally so that it could rotate it and so see the other items in the database without messing up the structure.
CODE
CSS
#fundo {
display: block;
height: 550px;
margin-left: -3%;
overflow: scroll;
overflow-y: hidden;
width: 1150px;
}
.vacina, .dose, .aplicacao {
background-color: #D3D3D3;
border-radius: 5px;
float: left;
height: 90px;
margin-top: 6px;
margin-left: 6px;
position: relative;
width: 100px;
}
.vacina {
height: 50px;
}
PHP
include_once ("db.php");
$sql = "SELECT nomeVacina FROM vacina ORDER BY cod";
$ds1=mysql_query($sql);
if ($ds1) {
if (mysql_num_rows($ds1) > 0) {
$x = 0;
///////////////////////////////////////////////
////////////////// DIV VACINA /////////////////
while($linha=mysql_fetch_assoc($ds1)) {
$x++;
if(!($linha['nomeVacina'] == "Outras")) {
echo "<div class='vacina' id='".$x."'>";
echo "<br>".$linha['nomeVacina'];
echo "</div>";
}
}
}
///////////////////////////////////////////////
////////////////// FIM DIV VACINA /////////////
///////////////////////////////////////////////
////////////////// DIV DOSE ///////////////////
for($i = 1; $i < 6; $i++) {
echo "<br><br><br><br><br><br>";
echo "<div class='dose'>";
if($i == 4 || $i == 5) {
echo "<br>Reforco";
}
else {
echo "<br>Dose ".$i;
}
echo "</div>";
///////////////////////////////////////////////
////////////////// FIM DIV DOSE ///////////////
///////////////////////////////////////////////
////////////////// DIV APLICACAO //////////////
$z=0;
for($j = 1; $j <= $x; $j++) {
$sql2 = "SELECT DATE_FORMAT(dataAplicacao, '%d/%m/%Y') AS dataAplicacao, loteVacina, descricaoVacina FROM vacinaaplicada WHERE dose = ".$i." AND codigoVacina = ".$j." AND codPaciente = '".$cns."'";
$ds2=mysql_query($sql2);
$linha2=mysql_fetch_assoc($ds2);
$z++;
echo "<div class='aplicacao' id='".$z.$i."'>";
if($linha2 == "") {
echo "";
}
else {
echo "<div style='margin-top:10px;'>". $linha2['descricaoVacina']."<div class='fonte'><b>Data</b><br></div>". $linha2['dataAplicacao'] . "<div class='fonte'><b>Lote</b><br></div>".$linha2['loteVacina']."</div>" ;
}
echo "</div>";
}
///////////////////////////////////////////////
////////////////// FIM DIV APLICACAO /////////////
}
As you can see in the previous image, has 9 div class Vacina.
If I add a div class Vacina the most, will mess up the table.
What I'd like is to insert more than 9 div class Vacina causing the background div (div class includes all div) increase in width, but leaving it the same way the image, just putting a scroll bar horizontally to display whole div.
If I understood you correctly, I'd try this:
To #fundo, add
white-space: nowrap;
And I replaced float: left; with:
display: inline-block;
Maybe that's what you're looking for.
EDIT:
Okay, I've built an example from scratch (but using javascript, not php, I can't test php atm): JSFiddle.
It's a bit messy but you should be able to code it in PHP if you like to.
Let me know if you've got trouble with this.
EDIT 2:
Just to have it in the answer (not just in its comments), the final solution is: this JSFiddle.
HTML + PHP
<?php
include_once("sessao.php");
if (!isset($_SESSION['funcionario']['cpfFuncionario'])) {
header("Location:index.html");
}
else if($_SESSION['funcionario']['adicionarDireito'] == 0) {
header("Location:funcionario.php");
}
?>
<html>
<head>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>
<title>Vacina Digital - Cadastrar Vacinação</title>
<script type="text/javascript" src="template/js/script.js"></script>
<link rel="stylesheet" href="template/css/reset.css">
<link rel="stylesheet" href="template/css/fonts.css">
<style>
body {
background-color: #fdfdfd;
overflow-y: auto;
}
#form {
margin-left: 50px;
padding-left: 7%;
padding-top: 50px;
padding-bottom: 10px;
margin-right: 50px;
border: 1px solid #0F935A;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-moz-box-shadow: 2px 2px 2px #cccccc;
-webkit-box-shadow: 2px 2px 2px #cccccc;
box-shadow: 2px 2px 2px #cccccc;
}
#form h1 {
text-align: center;
margin-right: 150px;
font-family: "RobotoCondensed";
font-size: 30px;
}
</style>
</head>
<body>
<?php
include_once 'menufuncionario.php';
?>
<div id="form">
<fieldset>
<?php
include_once("db.php");
if(isset($_POST['cns'])) {
$cns = $_POST['cns'];
$_SESSION['paciente'] = $cns;
}
else{
$cns = $_SESSION['paciente'];
}
$sql = "SELECT *, DATE_FORMAT(dataNascimento, '%d/%m/%Y') AS 'data' FROM populacao WHERE codigoCns = ".$cns;
$ds1=mysql_query($sql);
if ($ds1) {
if (mysql_num_rows($ds1) > 0) {
$sql2 = "SELECT * FROM vacinaaplicada WHERE codPaciente = ".$cns;
$ds2 = mysql_query($sql2);
$linha=mysql_fetch_assoc($ds2);
$linha2=mysql_fetch_assoc($ds1);
$data_nasc = $linha2['data'];
$data_nasc=explode("/",$data_nasc);
$data=date("d/m/Y");
$data=explode("/",$data);
$anos=$data[2]-$data_nasc[2];
if ($data_nasc[1] > $data[1]) {
$anos = $anos-1;
} if ($data_nasc[1] == $data[1]) {
if ($data_nasc[0] <= $data[0]) {
$anos = $anos;
} else {
$anos = $anos-1;
}
} if ($data_nasc[1] < $data[1]) {
$anos = $anos;
}
$data2=date("d/m/Y");
echo "<h1>Carteira de Vacinação - ".$linha2['nomeCrianca']."</h1>";
/*echo "
<div id='caderneta' style='margin-left:-6%'>
";*/
include_once 'caderneta.php';
echo "
</div>";
} else {
echo "<h1>CNS Inválido</h1><br><br>
<center><a href='javascript:window.history.go(-1)'><button style='margin-left:-150px' class='button button-red' href='javascript:window.history.go(-1)'>Voltar</button></a></center>
";
}
}
?>
</div>
</body>
</html>
Caderneta
<html>
<head>
<link rel="stylesheet" href="template/css/fonts.css">
<style type="text/css">
#fundo {
min-width: 800px;
display: block;
overflow: scroll;
overflow-y: hidden;
margin-left: -3%;
height: 550px;
white-space: nowrap;
}
#pinguim, .vacina, .dose, .aplicacao {
width: 100px;
height: 90px;
background-color: #D3D3D3;
margin-top: 6px;
margin-left: 6px;
border-radius: 5px;
position: relative;
float: left;
}
#pinguim, .vacina {
height: 50px;
}
.vacina, .dose{
background: green;
font-family: RobotoCondensed;
font-size: 14pt;
text-align: center;
color: #ffffff;
}
.vacina{
padding-top: -14px;
line-height: 15px;
}
.dose, .aplicacao{
margin-top: -32px;
}
.dose{
line-height: 29px;
}
.aplicacao, .fonte {
font-family: "RobotoLight";
text-align: center;
}
</style>
</head>
<body>
<div id = "fundo">
<div id = "pinguim">
</div>
<?php
include_once ("db.php");
$sql = "SELECT nomeVacina FROM vacina ORDER BY cod";
$ds1=mysql_query($sql);
if ($ds1) {
if (mysql_num_rows($ds1) > 0) {
$x = 0;
$k = 0;
while($linha=mysql_fetch_assoc($ds1)) {
$x++;
if(!($linha['nomeVacina'] == "Outras")) {
echo "<div class='vacina' id='".$x."'>";
echo "<br>".$linha['nomeVacina'];
echo "</div>";
}
}
for($i = 1; $i < 6; $i++) {
echo "<br><br><br><br><br><br>";
echo "<div class='dose'>";
if($i == 4 || $i == 5) {
echo "<br>Reforco";
}
else {
echo "<br>Dose ".$i;
}
echo "</div>";
$z=0;
for($j = 1; $j <= $x; $j++) {
$sql2 = "SELECT DATE_FORMAT(dataAplicacao, '%d/%m/%Y') AS dataAplicacao, loteVacina, descricaoVacina FROM vacinaaplicada WHERE dose = ".$i." AND codigoVacina = ".$j." AND codPaciente = '".$cns."'";
$ds2=mysql_query($sql2);
$linha2=mysql_fetch_assoc($ds2);
$z++;
echo "<div class='aplicacao' id='".$z.$i."'>";
if($linha2 == "") {
echo "";
}
else {
echo "<div style='margin-top:10px;'>". $linha2['descricaoVacina']."<div class='fonte'><b>Data</b><br></div>". $linha2['dataAplicacao'] . "<div class='fonte'><b>Lote</b><br></div>".$linha2['loteVacina']."</div>" ;
}
echo "</div>";
}
}
echo"</div>";
}
}
?>
</div>
</div>
</body>
</html>
<?php include('_header.php'); ?>
<?php
// if you need the user's information, just put them into the $_SESSION variable and output them here
echo WORDING_YOU_ARE_LOGGED_IN_AS . $_SESSION['user_name'] . "<br />";
//echo WORDING_PROFILE_PICTURE . '<br/><img src="' . $login->user_gravatar_image_url . '" />;
echo WORDING_PROFILE_PICTURE . '<br/>' . $login->user_gravatar_image_tag;
?>
<div>
<?php echo WORDING_LOGOUT; ?>
<?php echo WORDING_EDIT_USER_DATA; ?>
</div>
<?php include('_footer.php'); ?>
After logging in when it displays the "you are logged in" it is in the top left corner of my page and I need it in the top right corner.
I have tried multiple methods and none of them seem to solve my issue
here is the _header.php file, I have tried finding the "your logged in" section but unable to locate it.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>php-login-advanced</title>
<style type="text/css">
/* just for the demo */
body {
font-family: Arial, sans-serif;
font-size: 12px;
margin: 10px;
}
label {
position: relative;
vertical-align: middle;
bottom: 1px;
}
input[type=text]
{ position: absolute;
display: block;
top: 45px;
right: 30px;
}
input[type=password]
{ position: absolute;
display: block;
top: 80px;
right: 30px;
}
input[type=submit]
{ position: absolute;
display: block;
top: 115px;
right: 30px;
}
input[type=email] {
top: 30px;
right: 25px;
display: block;
margin-bottom: 15px;
}
input[type=checkbox] {
margin-bottom: 15px;
}
</style>
</head>
<body>
<?php
// show potential errors / feedback (from login object)
if (isset($login)) {
if ($login->errors) {
foreach ($login->errors as $error) {
echo $error;
}
}
if ($login->messages) {
foreach ($login->messages as $message) {
echo $message;
}
}
}
?>
<?php
// show potential errors / feedback (from registration object)
if (isset($registration)) {
if ($registration->errors) {
foreach ($registration->errors as $error) {
echo $error;
}
}
if ($registration->messages) {
foreach ($registration->messages as $message) {
echo $message;
}
}
}
?>
Add style="float:right;" to the div
Or better put this in a separate CSS file, in a CSS class declaration, and add the class to you div.
It would be something like
<div class="pull-right">
Add in the head of your HTML file :
<link rel="stylesheet" type="text/css" href="mycss.css" />
And in the mycss.css file:
.pull-right {
float:right;
}
I've created a blog main page using PHP and have included a sidebar and main area for the posts. When I add any more content to either the sidebar or the main content/posts area the content expands over the main div and the main div doesn't expand. How can I go about creating a div tag that will expand according to the content in the inner two divs.
Main Page:
<html>
<head>
<meta name="keywords" content="Mac user Ultan Casey TheCompuGeeks UltanKC">
<meta name="description" content="The Home of one of Ireland's budding Technology Reviewers Ultan Casey">
<title>Ultan.me - Home of Ultan Casey</title>
<link rel="stylesheet" href="css/styles.css" type="text/css" />
<style>
<!--
a {text-decoration:none}
//-->
</style>
</head>
<div id="main">
<!-- Menu Start -->
<div id="menu">
<ul>
<li>home</li>
<li>about me</li>
<li>archives</li>
<li>contact</li>
<li>gallery</li>
<div id="search">
<input type="text" name="q" value="search" />
<input type="button" name="Submit" value="Submit" />
</div>
</ul>
</div>
<!-- Menu End -->
<img src="images/banner.png" />
<div id="posts">
<?php
mysql_connect ('localhost', 'root', 'root') ;
mysql_select_db ('ultankc');
$blog_postnumber = 5;
if (!isset($_GET['page']) || !is_numeric($_GET['page'])) {
$page = 1;
}
else {
$page = (int)$_GET['page'];
}
$from = (($page * $blog_postnumber) - $blog_postnumber);
$sql = "SELECT * FROM php_blog ORDER BY timestamp DESC LIMIT $from, $blog_postnumber";
$result = mysql_query($sql) or print ("Can't select entries from table php_blog.<br />" . $sql . "<br />" . mysql_error());
while($row = mysql_fetch_array($result)) {
$date = date("l F d Y", $row['timestamp']);
$title = stripslashes($row['title']);
$entry = stripslashes($row['entry']);
$id = $row['id'];
$get_categories = mysql_query("SELECT * FROM php_blog_categories WHERE `category_id` = $row[category]");
$category = mysql_fetch_array($get_categories);
?>
<p><?php echo "<p><strong>" . $title . "</strong></p>"; ?><br /><br />
<?php echo $entry; ?><br /><br />
<p>Posted in <?php echo $category['category_name']; ?> on <?php echo $date; ?></p>
<hr /></p>
<?php
}
?>
<div id="pages">
<?php
$total_results = mysql_fetch_array(mysql_query("SELECT COUNT(*) AS num FROM php_blog"));
$total_pages = ceil($total_results['num'] / $blog_postnumber);
if ($page > 1) {
$prev = ($page - 1);
echo "<< Newer ";
}
for($i = 1; $i <= $total_pages; $i++) {
if ($page == $i) {
echo "$i ";
}
else {
echo "$i ";
}
}
if ($page < $total_pages) {
$next = ($page + 1);
echo "Older >>";
}
?>
</div>
</div>
<!-- Sidebar Start -->
<div class="sidebar">
<!-- Item 1 -->
<div id="side-item">
<h2>
<a href="http://www.dailybooth.com/UltanCasey">
<img src="images/db-icon.jpg">Dailybooth
</a></h2>
<div id="side-item-content">
<center>
<img src="http://dailybooth.com/UltanCasey/latest/medium.jpg" />
</center>
</div>
</div>
<!-- Item 2 -->
<div id="side-item">
<h2><img src="images/connect.jpg" />Connect</h2>
</div>
<div id="side-item-content">
<div class="tweet-title"><p>Latest Tweet:</p></div>
<div id="tweet">
<?php
function getTwitterStatus($userid){
$url = "http://twitter.com/statuses/user_timeline/$userid.xml?count=1";
$xml = simplexml_load_file($url) or die("could not connect");
foreach($xml->status as $status){
$text = $status->text;
}
echo $text;
}
getTwitterStatus("UltanKC");
?>
</div>
<br>
<ul>
<li id="social">YouTube</li>
<li id="social">Twitter</li>
<li id="social">LastFM</li>
<li id="social">Email</li>
</ul>
</div>
<!-- Item 2 End-->
<div id="side-item">
<h2>Archives</h2>
</div>
<div id="side-item-content">
<?php
mysql_connect ('localhost', 'root', 'root') ;
mysql_select_db ('ultankc');
$result = mysql_query("SELECT FROM_UNIXTIME(timestamp, '%Y') AS get_year, COUNT(*) AS entries FROM php_blog GROUP BY get_year");
while ($row = mysql_fetch_array($result)) {
$get_year = $row['get_year'];
$entries = $row['entries'];
echo "Entries from " . $get_year . " (" . $entries . ")<br />";
}
?>
<?php
mysql_connect ('localhost', 'root', 'root') ;
mysql_select_db ('ultankc');
$result1 = mysql_query("SELECT * FROM php_blog_categories ORDER BY category_name ASC");
while($row = mysql_fetch_array($result1)) {
$result2 = mysql_query("SELECT COUNT(`id`) AS entries FROM php_blog WHERE category = $row[category_id]");
$num_entries = mysql_fetch_array($result2);
echo '' . $row['category_name'] . ' (' . $num_entries['entries'] . ')<br />';
}
?>
</div>
</div>
</div>
<!-- Sidebar End -->
</div>
</html>
CSS:
*{
margin: 0px;
padding: 0px;
}
body{
background-color: #eeeeee;
height: 100%;
}
#menu {
background-color: #282828;
height:20px;
width: 840px;
padding: 10px;
}
#main {
width: 860px;
height: 100%;
margin-left: auto;
margin-right: auto;
background-color: #ffffff;
-webkit-box-shadow: 2px 0px 5px #bbbbbb,-2px 0 5px #bbbbbb;
-moz-box-shadow: 2px 0px 5px #bbbbbb,-2px 0px 5px #bbbbbb;
}
#menu li {
display: inline;
list-style-type: none;
height: 20px;
margin-top: 10px;
margin-left: 5px;
}
#menu a, menu a:visited{
font-family: arial;
color: #ffffff;
text-decoration: none;
padding: 3px;
}
#menu a:hover{
font-family: arial;
color: #282828;
text-decoration: none;
padding: 3px;
background-color: #ffffff;
}
#search{
float: right;
}
.sidebar {
width: 260px;
height: 100%;
float: right;
margin-right: 4px;
}
#posts {
width: 590px;
height: 100%;
float: left;
}
#side-item h2 {
background-color: #282828;
width: 245px;
height: 30px;
font-size: 25px;
font-family: arial;
color: #ffffff;
padding: 5px;
padding-top: 6px;
padding-bottom: 4px;
}
#side-item-content{
border:1px solid #dadada;
padding: 5px;
width: 243px;
margin-bottom: 12px;
}
#side-item h2 img {
margin-right: 6px;
float: left;
}
#side-item h2 a:link {
text-decoration: none;
color: #ffffff;
}
#side-item h2 a:hover {
text-decoration: underline;
color: #ffffff;
}
#side-item h2 a:visited {
text-decoration: none;
color: #ffffff;
}
#social {
background-color: #282828;
width: 223px;
height: 20px;
font-size: 20px;
font-family: arial;
color: #ffffff;
display: block;
margin-top: 5px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
padding: 10px;
}
/*#social img {
float: left;
padding-top: -12px;
}*/
#social a:link {
font-size: 20px;
font-family: arial;
color: #ffffff;
text-decoration: none;
}
#tweet {
width: 221px;
padding: 10px;
color: #242424;
background-color: #f5f5f5;
border:1px solid #282828;
margin-bottom: -8px;
font-family: arial;
}
#social a:hover{
font-size: 20px;
font-family: arial;
color: #ffffff;
text-decoration: underline;
}
#social a:visited {
font-size: 20px;
font-family: arial;
color: #ffffff;
text-decoration: none;
}
.tweet-title {
background-color: #2dbfe9;
color: #ffffff;
width: 231px;
height: 20px;
border-left:1px solid #282828;
border-right:1px solid #282828;
border-top:1px solid #282828;
font-size: 20px;
padding: 5px;
font-family: arial;
}
.tweet-title a:link, .tweet-title a:visited {
color: #ffffff;
text-decoration: none;
}
.tweet-title a:hover {
color: #2dbfe9;
text-decoration: none;
background-color: #ffffff;
}
#pages {
float: left;
}
Image:
First: Where are your <body> tags?
Ok here is how I made it works. It seems that #pages and #sidebar they should be in separate <div> tag. The code (I deleted PHP from it)
HTML:
<html>
<head>(content)</head>
<body> <!-- never forget about body tags!!!!!!!!!-->
<div id="main">
<!-- Menu Start -->
(...)
<!-- Menu End -->
<div id="content"> <!-- this is new -->
<div id="posts">
(content)
</div>
<div class="sidebar">
(content)
<!-- Sidebar End -->
<div class="clr" /> <this is new>
</div>
</div>
</body>
<
and CSS:
\*{
margin: 0px;
padding: 0px;
}
body{
background-color: #eeeeee;
}
\#menu {
background-color: #282828;
height:20px;
width: 840px;
padding: 10px;
position: relative;
}
\#main {
width: 860px;
margin: 0 auto;
background-color: #ffffff;
-webkit-box-shadow: 2px 0px 5px #bbbbbb,-2px 0 5px #bbbbbb;
-moz-box-shadow: 2px 0px 5px #bbbbbb,-2px 0px 5px #bbbbbb;
}
.clr{
clear: both;
}
\#content{
position: relative;
width: 860px;
}
.sidebar {
position: relative;
width: 260px;
float: right;
margin-right: 4px;
}
\#posts {
width: 590px;
position: relative;
float: left;
}
I believe this should do the work.
PS. Shadow doesn't work in Opera.
Best Regards,
ventus