I have the following codes written:
<html>
<head>
<?php
if (isset($_POST['report']))
{
$name = $_POST['Name'] ;
$email = $_POST['Email'] ;
header('Location: subscriber.php?key='.$name.'?key1='.$email);
}
?>
<script type="text/javascript" src="assets/bootstrap/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="inner.css" type="text/css" />
<style>
div#copyright {
float: left;
width: 100%;
background: #000;
color: #fff;
padding: 15px 15px;
}
.c_right {
float: left;
width: 50%;
text-align: left;
}
#copyright li {
float: left;
width: 30px;
margin-right: 10px;
list-style:none !important;
}
.c_left {
float: right;
}
</style>
</head>
<body>
<div id="footer">
<div class="container-fluid">
<div class="row">
<div class="col-xs-6 col-sm-3">
<h3>Quick Links</h3>
<div id="footnav1">
<ul>
<li>About Us</li>
<li>FAQs</li>
<li>Sitemap</li>
<li>Contact Us</li>
<li>Term & Conditions</li>
</ul>
</div>
</div>
<div class="col-xs-6 col-sm-3">
<h3>Quick Links</h3>
<div id="footnav2">
<ul>
<li>Privacy & Cookie Policy</li>
<li>Megahung Blog</li>
<li>Donate Cashback</li>
<li>How Megahung Works</li>
<li>Why Choose Megahunt?</li>
</ul>
</div>
</div>
<div class="col-xs-6 col-sm-3">
<h3>Quick Links</h3>
<div id="footnav3">
<ul>
<li>Home</li>
<li>About</li>
<li>Services</li>
<li>Catalog</li>
<li>Blog</li>
<li>Contact</li>
</ul>
</div>
</div>
<div class="col-xs-6 col-sm-3">
<h3>Newsletter</h3>
<div id="footnav4" class="nl_subscribe">
<form method="post">
<input type="text" name="Name" size="20" class="email_css" placeholder="Enter your name...">
<input type="text" name="Email" size="20" class="email_css" placeholder="Enter your email...">
<input type="submit" name="report" value="Subscribe" class="btn btn-subscribe"/>
</form>
</div>
</div>
</div>
</div>
</div>
<div id="copyright">
<div class="c_right"><h3 class="cp">Copyright © 2015 <span style="color:#ff6803">Megahunt</span>. All Rights Reserved.</h3></div>
<div class="c_left">
<ul class="social">
<li><img src="images/facebook.png"></li>
<li><img src="images/twitter.png"></li>
<li><img src="images/linkedin.png"></li>
<li><img src="images/google.png"></li>
<li><img src="images/instagram.png"></li>
<li><img src="images/pinterest.png"></li>
<ul>
</div>
</div>
</body>
</html>
Now when I click on the Submit button the page is loaded but its actually loaded in the same page not going to subscriber.php page.
I have placed the php block before the html also but still the same issue persists.
Can anyone help me with this issue please.
I reopened the question since the OP does not seem to understand what the duplicate question link's instructions are.
How to fix "Headers already sent" error in PHP
As I said in comments, you are outputting before header, and you're not seeing this warning because your system most likely does not have error reporting enabled. Consult my footnotes about this.
Modify your code to this (rest of code omitted) and exit added.
Sidenote: Make sure there are no spaces before your opening <?php tag and that your file does not contain a byte order mark. Absolutely NOTHING should be above your opening PHP, no includes etc.
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
if (isset($_POST['report']))
{
$name = $_POST['Name'] ;
$email = $_POST['Email'] ;
header('Location: subscriber.php?key='.$name.'?key1='.$email);
exit;
}
?>
<html>
<head>
<script type="text/javascript" src="assets/bootstrap/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="inner.css" type="text/css" />
...followed by the rest of your code.
Also make sure that your subscriber.php does not also have anything that will cause an output before header.
Footnotes:
Add error reporting to the top of your file(s) which will help find errors.
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
// rest of your code
Sidenote: Error reporting should only be done in staging, and never production.
You should also use a conditional !empty() for your inputs.
Related
I'm learning PHP and I found useful tutorials online, so I'm trying to build my very first site in PHP. I have a problem with CSS implementation. I keep my tab with localhost always on so I dont have to run it every single time when I change something. Problem is, when I code some CSS it loads on my registration form, but when i refresh the page, it's like I never coded CSS for that page. (sorry for bad english I hope You guys understand what I wanted to say..)
Here's the signup.php code :
<div class="container">
<div class="row" style="text-align:center;">
<h3>EPO - Sistem - Registracija </h3>
</div>
<div class="row sub_msg">
<p> Veb aplikacija za evidenciju predispitnih obaveza. </p>
</div>
<div class="row signup">
<div class="row">
<h3> Dobrodosli, molimo Vas, unesite podatke za registraciju. </h3>
</div>
<form action="" method="post" class="form-horizontal">
<div class="row form-group input_group">
<label for="" class="col-sm-2" >E-mail:</label>
<div class="col-sm-10">
<input type="text" name="email" class="form-control">
</div>
</div>
<div class="row form-group input_group">
<label for="" class="col-sm-2" >Firstname:</label>
<div class="col-sm-10">
<input type="text" name="firstname" id="firstname" class="form-control">
</div>
</div>
<div class="row form-group input_group">
<label for="" class="col-sm-2" >Lastname:</label>
<div class="col-sm-10">
<input type="text" name="lastname" id="lastname" class="form-control">
</div>
</div>
<div class="row form-group input_group">
<label for="" class="col-sm-2" >Password:</label>
<div class="col-sm-10">
<input type="password" name="password" id="password" class="form-control">
</div>
</div>
<div class="row form-group" style="margin:0px 10px 20px 10px">
<div class="col-xs-12">
<input type="submit" name="submit" id="Registruj se" class="form-control">
</div>
</div>
</form>
</div>
</div>
And here's the Index page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>EPO - Pocetna stranica</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<link rel="stylesheet" href=" ./css/custom.css">
</head>
<body>
<nav class="navbar" style="background-color: #c40707">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand crud" style="color: darkgray !important" href="#">EPO Aplikacija</a>
</div>
</div>
</nav>
<div class="container">
<ul class="nav nav-tabs">
<li><a data-toggle='tab' href="#index">Pocetna stranica</a></li>
<li><a data-toggle='tab' href="#login">Ulogujte se</a></li>
<li><a data-toggle='tab' href="#signup">Prijavite se</a></li>
</ul>
<div class="tab-content">
<div id="index" class="tab-pane fade in">
<p>Index</p>
</div>
<div id="login" class="tab-pane fade in">
<p>Login</p>
</div>
<div id="signup" class="tab-pane fade in">
<?php include("./user/signup.php"); ?>
</div>
</div>
</div>
</body>
</html>
And here's the css code:
body{
background-color: darkgray;
font-size: 22px;
margin: 0;
padding: 0;
}
.crud{
width:auto;
color: #605d5d !important;
font-size: 25px;
font-weight: 800;
}
.sub_msg{
text-align: center;
padding: 10px 0px 20px 0px;
}
.signup{
border: 1px solid #c40707;
text-align: center;
width: 60%;
height: auto;
margin: auto;
}
.input_group{
margin: 0px 20px 20px 20px;
}
.input_group input{
height: 40px;
font-size: 20px;
}
input[type="submit"]{
height: 40px;
font-size: 20px;
font-weight: bold;
background-color: #c40707;
color: #605d5d !important;
}
I'm stuck her for over two hours, and I'm pretty sure it's some beginners silly mistake but I can't find it..
Correct the path of from <link rel="stylesheet" href=" ./css/custom.css"> to <link rel="stylesheet" href="./css/custom.css">
If still not work then force your browser to refresh the stylesheet.
Check by adding version number like
<link rel="stylesheet" type="text/css" href="./css/custom.css?version=51">
In the code below href attribute has unneeded space in it.
<link rel="stylesheet" href=" ./css/custom.css">
Should be:
<link rel="stylesheet" href="./css/custom.css">
Also sometimes you may need to clear cache for the changes in your css to appear.
In this case, cause it can become tiresome pressing the refresh button, rather than do a refresh, I add a random value at the end of the css url to make it appear like a new url so no caching will happen.
Like
<link rel="stylesheet" href="./css/custom.css?<?php echo rand(1,300);?>">
Try to change this line (assuming that your css folder in in the same level as you index.php)
<link rel="stylesheet" href=" ./css/custom.css">
To this this
<link rel="stylesheet" href="css/custom.css?t=<?php echo time(); ?>">
Remove the <?php echo time(); ?> once you go on production as it meant on for development so you don't need to clear the cache or the hard reload if the changes in your css are not reflected in the browser.
Is my coding not correct or what's the problem in hover and footer. And i need to know about php mail program is that right or do I have mistakes in it i am not able to find errors because mail function doesnt work in local server.
<?php
if(isset($_POST["submit"])){
if($_POST["name"]==""||$_POST["email"]==""||$_POST["phone"]==""||$_POST["msg"]==""){
echo "Fill All Fields..";
}
else
{
$email=$_POST['email'];
$email= filter_var($email, FILTER_VALIDATE_EMAIL);
if (!$email){
echo "Invalid Sender's Email";
}
else{
$subject = $_POST['sub'];
$message = $_POST['msg'];
$headers = 'From:'. $email2 . "\r\n";
$headers .= 'Cc:'. $email2 . "\r\n";
$message = wordwrap($message, 70);
mail("recievers#gmail.com", $subject, $message, $headers);
echo "Your mail has been sent successfuly!";
}
}
}
?>
#wrapper
{
width:100%;
height:auto;
margin:0px;
background-color:orange;
}
#navbar
{
height:60px;
width:100%;
background-color:black;
color:white;
float:left;
}
ul li
{
display: block;
position: relative;
padding:20px 20px;
float:left;
}
ul li a
{
color:white;
}
#navbar a:hover
{
color:red;
padding:5px;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img
{
width: 70%;
height:15%;
margin: auto;
background-color:white;
}
.thumbnail
{
height:300px;
width:300px;
padding:25px auto;
margin:5px;
}
.contact
{
width:60%;
height:300px;
background-color:grey;
padding:100px 25px;
float:left;
}
.enquiry
{
width:40%;
height:300px;
background-color:seagreen;
float:left;
padding-left:5px;
}
input[type=text]:focus {
border: 3px solid red;
}
input[type="text"]
{
margin: 0 0 15px 0;
}
.footer
{
height:60px;
width:100%;
background-color:black;
padding:10px;
color:white;
float:left;
}
.footer img
{
float:right;
margin:5px;
padding:5px;
}
<!doctype html>
<html>
<head>
<title>student</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div id="wrapper"><!--start wrapper-->
<div id="navbar"><!--start nav-->
<ul>
<li><a href="home.html">Home</li>
<li><a href="about.html">About us</li>
<li><a href="services.html">Services</li>
<li><a href="products.html">Products</li>
<li><a href="contact.html">Contact us</li>
</ul>
</div><!--end nav-->
<div id="myCarousel" class="carousel slide" data-ride="carousel"><!--carasel start-->
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
<li data-target="#myCarousel" data-slide-to="4"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="D:\task\photo\h.jpg" alt="Home" height="400px">
<div class="carousel-caption">
<h3>Home</h3>
</div>
</div>
<div class="item">
<img src="D:\task\photo\as.jpg" alt="About us" height="400px">
<div class="carousel-caption">
<h3>About us</h3>
</div>
</div>
<div class="item">
<img src="D:\task\photo\s.jpg" alt="Services" height="400px">
<div class="carousel-caption">
<h3>Services</h3>
</div>
</div>
<div class="item">
<img src="D:\task\photo\p.jpg" alt="Products" height="400px">
<div class="carousel-caption">
<h3>products</h3>
</div>
</div>
<div class="item">
<img src="D:\task\photo\c.jpg" alt="Contact us" height="400px">
<div class="carousel-caption">
<h3>Contact us</h3>
</div>
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div><!--end carosel-->
<div class="container-fluid text-center bg-grey"><!--boxes-->
<div class="row text-center">
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\i.jpg" alt="Innovation">
<p><strong>Innovation</strong></p>
</div>
</div>
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\cr.png" alt="Creative">
<p><strong>Creativity</strong></p>
</div>
</div>
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\po.jpg" alt="Positive">
<p><strong>Positivity</strong></p>
</div>
</div>
</div><!--end boxes-->
<div id="con">
<div class="contact">
<h1>Address</h1>
<p><span class="glyphicon glyphicon-map-marker"></span>
Abc private limited
no54,2ndstreet,
madipakkam,
chennai-67.
</p>
<p><span class="glyphicon glyphicon-envelope"></span> ABCPVT#gmail.com</p>
</div>
<div class="enquiry">
<h1>Enquiry Form</h1>
<table border="0" align="center">
<form name="form" action="email.php" id="form" method="post">
<tr>
<tr>
<td>Name</td>
<td><input name="name" placeholder="Name" type="text" value=""></td>
</tr>
<tr>
<td>Email</td>
<td><input name="email" placeholder="Email" type="text" value=""></td>
</tr>
<tr>
<td>Phone</td>
<td><input name="phone" placeholder="phonenumber" type="text" value=""></td>
</tr>
<tr>
<td>Message</td>
<td><textarea name="msg" placeholder="Type your text here..."></textarea></td>
</tr>
<td colspan="2" style="text-align:center"><input id="send" name="submit" type="submit" value="Submit"></td>
</tr>
</form>
</table>
</div>
</div>
<div class="footer">
copyrights © to WWW.abcpvt.com
<img src="E:\photos\fb.png" alt="fb"/>
<img src="E:\photos\ln.png" alt="tweet"/>
<img src="E:\photos\tw.png" alt="linkedin"/>
</div>
</div><!--end wrapper-->
</body>
</html>
You can send mail from localhost with sendmail package , sendmail package is inbuild in XAMPP. So if you are using XAMPP then you can easily send mail from localhost.
for example you can configure C:\xampp\php\php.ini and c:\xampp\sendmail\sendmail.ini for gmail to send mail.
in C:\xampp\php\php.ini find extension=php_openssl.dll and remove the semicolon from the beginning of that line to make SSL working for gmail for localhost.
in php.ini file find [mail function] and change
SMTP=smtp.gmail.com
smtp_port=587
sendmail_from = my-gmail-id#gmail.com
sendmail_path = "\"C:\xampp\sendmail\sendmail.exe\" -t"
Now Open C:\xampp\sendmail\sendmail.ini. Replace all the existing code in sendmail.ini with following code
[sendmail]
smtp_server=smtp.gmail.com
smtp_port=587
error_logfile=error.log
debug_logfile=debug.log
auth_username=my-gmail-id#gmail.com
auth_password=my-gmail-password
force_sender=my-gmail-id#gmail.com
Now you have done!! create php file with mail function and send mail from localhost.
PS: don't forgot to replace my-gmail-id and my-gmail-password in above code. Also, don't forget to remove duplicate keys if you copied settings from above. For example comment following line if there is another sendmail_path :
sendmail_`path="C:\xampp\mailtodisk\mailtodisk.exe"
in the php.ini file
Also remember to restart the server using the XAMMP control panel so the changes take effect.
OR
XMail or hMailServer can do the trick.
OR
try PHPMailer
Hover is not working
It is because of carousel-inner is overflow in your #navbar div ,so use overflow: hidden;
footer is not taking 100%!! Because footer is #wrapper child class, so 100% will take that parent(#wrapper) width only.Thus use vw instead of % and calculate margin-left property will solve your problem
#navbar
{
height:60px;
width:100%;
background-color:black;
color:white;
overflow: hidden;
}
.footer
{
height:60px;
width: 100vw;
margin-left: calc(-51vw + 50%);
background-color:black;
padding:10px;
color:white;
position: fixed;
bottom: 0;
}
#con {
margin-bottom: 23vw;
}
The reasons for the footer not been 100%.
Its 100% per say but it becomes more than 100% after adding padding:10px;. To solve this you have to options. Its either you use width:100%; and add no padding, or you add padding and use display:block; instead of width:100%;
Secondly, you have a closing div missing for the box.
You have
<div class="container-fluid text-center bg-grey"><!--boxes-->
<div class="row text-center">
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\i.jpg" alt="Innovation">
<p><strong>Innovation</strong></p>
</div>
</div>
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\cr.png" alt="Creative">
<p><strong>Creativity</strong></p>
</div>
</div>
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\po.jpg" alt="Positive">
<p><strong>Positivity</strong></p>
</div>
</div>
</div><!--end boxes-->
Instead of:
<div class="container-fluid text-center bg-grey"><!--boxes-->
<div class="row text-center">
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\i.jpg" alt="Innovation">
<p><strong>Innovation</strong></p>
</div>
</div>
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\cr.png" alt="Creative">
<p><strong>Creativity</strong></p>
</div>
</div>
<div class="col-sm-4">
<div class="thumbnail">
<img src="D:\task\photo\po.jpg" alt="Positive">
<p><strong>Positivity</strong></p>
</div>
</div>
</div><!-- this is the missing closing div-->
</div><!--end boxes-->
Then lastly. You have to take away float:left; from the footer and use clear:both; instead. Doing this you will notice you have a better result.
I don't know what wrong with my code but it wont display the position i want.
Here's the output:
Output of my code
And here's my code:
<!DOCTYPE html>
<html>
<head>
<title>Escapade Travel & Tours</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.css" rel="stylesheet">
<!--Google Fonts-->
<link href='http://fonts.googleapis.com/css?family=Duru+Sans|Actor' rel='stylesheet' type='text/css'>
<link href="css/bootshape.css" rel="stylesheet">
</head>
<body>
<!-- Navigation bar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="Home.html"><span class="green">Escapade</span> Travel & Tours</a>
</div>
<nav role="navigation" class="collapse navbar-collapse navbar-right">
<ul class="navbar-nav nav">
<li class="active">Home
</li>
<li class="dropdown">
<a data-toggle="dropdown" href="#" class="dropdown-toggle">Destination <b class="caret"></b></a>
<ul class="dropdown-menu">
<li>Boracay
</li>
<li class="active">Palawan
</li>
<li>Cebu
</li>
<li class="divider"></li>
<li>All Destinations
</li>
</ul>
</li>
<li>Special Offers
</li>
<li>Book Now!
</li>
<li>Contact Us
</li>
</ul>
</nav>
</div>
</div>
<!-- End Navigation bar -->
<!-- Content -->
<div class="container">
<div style="clear: both; height:40px;"></div>
<div style="clear: both; height:15px;"></div>
<div style="clear: both; height:15px;"></div>
<div id="cont_razd">
<div id="right">
<h1>Meet Us</h1>
<div style="height:15px;"></div>
<div class="box_us">
<div class="box_us_r">
<img src="img/fish_us1.gif"> Quezon City, Philippines</div>
<div style="clear: both; height:15px;"></div>
<p>
<img src="img/fish_us2.gif"> Telephone: 02-1234567</p>
<div style="clear: both; height:15px;">
<p> Cellphone: 0912-345-6789</p>
<div style="clear: both; height:15px;"></div>
</div>
</div>
<div class="box_us">
<div class="box_us_l"></div>
<div class="box_us_r">
<div class="box_us_r">
<div style="clear: both; height:15px;"></div>
<img src="img/fish_us3.gif" alt="" /> Email Add: escapadetravelandtours#yahoo.com</div>
</div>
</div>
<div class="box_us">
</div>
<div style="height:25px;"></div>
<b> <i> Book us now and get very good rates! :) </b>
</i>
<br/>
</div>
<div id="left">
<h1>Contact Us</h1>
<div style="clear: both; height:15px;"></div>
<?php echo "<form action=" " method="post ">
<b> Name: </b> <br>
<input type=text size=40 name="ContactName ">
<br> <br> <b> E-mail Address: </b> <br>
<input type=text size=40 name="ContactEmail ">
<br> <br> <b> Subject: </b> <br>
<input type=text size=40 name="ContactSubject ">
<br> <br> <b> Message: </b> <br>
<textarea cols=40 rows=5 input type=text size=150 name="ContactMessage "> </textarea>
<br> <br>
<input type="Submit " name="Send " value="Send ">
<input type="Reset " name="Reset " value="Reset ">" ?>
<div style="clear: both"></div>
</div>
</div>
</div>
<!-- End Content -->
<!-- Footer -->
<div class="footer text-center">
<p>© 2016. All Rights Reserved. Created by</p>
</div>
<!-- End Footer -->
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootshape.js"></script>
</body>
</html>
I want the meet us to be place in the right while the contact us is in the left but it wont place to where i indicate them.
I have put <div id="right"> in meets us and <div id="left"> in contact us.
I'm using notepad ++ here.
This is my expected output
Please help. Thanks!
Just add this css will make as per your expected result:
#left {
float: left;
}
#right {
float: right;
}
Working Fiddle
You can try below code:
<div class="clearfix">
<div class="col-lg-6 col-md-6 col-sm-6">
left
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
right
</div>
</div>
use bootstrap girds see example of bootstrap girds see here also
you could use
<div class="row">
<div class="col-lg-9">
Your Left content
</div>
<div class="col-lg-3">
Your right content
</div>
</div>
the easiest way, while you use Bootstrap..
You have included bootstrap anyway in your code.. So you can use the bootstrap class.
<div class="row>
<div class="col-lg-6 col-xs-12">
<!-- Put your contact Us div here -->
</div>
<div class="col-lg-6 col-xs-12">
<!-- Put your meet Us div here -->
</div>
</div>
div id = "right"
does not place your div to the right, it just gives it an id.
Enclose both the divs in a
div class = "row"
and then the child divs using column span.
Learn about the bootstrap grid system here:-
http://www.w3schools.com/bootstrap/bootstrap_grid_system.asp
Put the "Contact Us" div before the "Meet Us" div. Then Apply float:left; to both the element. Try to avoid float:right; as much as possible.
Otherwise you can use use display:inline-block to both the divs. Will work just like float and on top of that you can even align them vertically.
In The below codeigniter code i want to create a pdf file but it displays the webpage.And i down load the tutorial From this site http://blog.luutaa.com/php/generating-a-pdf-using-codeigniter/ and i create helper and i create mpdf folder and put all the extracted files in to it and place the contoller code for pdf.But the issue is not solved .
Controller:
<?php
class Help extends ci_controller
{
function index()
{
$this->load->view('help_view');
}
//to create the data and insetin to the coursesubject table
public function pdf_report(){
$this->load->helper(array('My_Pdf')); // Load helper
$data = file_get_contents(site_url('http://localhost/seatingreport4/index.php/help')); // Pass the url of html report
create_pdf($data); //Create pdf
}
}
?>
View:
<!DOCTYPE html>
<html>
<head>
<?php include_once('header2.php'); ?>
<div id="showhide">
<?php include_once('menu.php'); ?>
</div>
<a id="toggle" onClick="showorhide('showhide')"><img src="<?php echo base_url('img/m.jpg'); ?>" HEIGHT="40" WIDTH="40" BORDER="0" alt="logo"style="margin-bottom:7px; margin-top:7px;" /></a></a>
<br>
<div class="gray_bg">
<div class="container">
<div class="row welcome_inner">
<div class="span13">
<h1 class="p"><span class="k">///</span> Help</h1>
</div>
</div>
</div>
</div>
<style>
.k{
color:#339900;
font-size: xx-large;
}
.p{
font-size: xx-large;
font-weight:900;
}
</style>
<script src="//cdn2.editmysite.com/js/vendor/modernizr.js"></script>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,300,400,700" />
<link rel="stylesheet" type="text/css" href="http://cdn2.editmysite.com/css/public.css?buildTime=1383786711" />
<!--[if IE 8]><link rel="stylesheet" type="text/css" href="http://cdn2.editmysite.com/css/public-ie8.css?buildTime=1383786711" /><![endif]-->
<!--[if IE 7]><link rel="stylesheet" type="text/css" href="http://cdn2.editmysite.com/css/public-ie7.css?buildTime=1383786711" /><![endif]-->
<script> var loginData = {"use_ssl":true,"redirect":false}; var errorMsgs = {"wrongUserPass":"Wrong username or password","loginToAccess":"Please log-in to access that page","loginAgain":"Please log-in again to continue.","accountDeleted":"Your account was previously deleted","accountExists":"You already have an account. Please log-in.","loginInstead":"You already have an account. Please log-in."}; var DISABLE_SIGNUP_CAPTCHA = true; var facebook = {"app_id":"190291501407","domain":"www.weebly.com","user":false}; </script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="//cdn1.editmysite.com/libraries/prototype/1.7-custom/prototype.min.js?2"></script>
<script type="text/javascript" src="http://cdn2.editmysite.com/js/public/main.js?buildTime=1383786711"></script>
</head>
<body class="w-ui homepage">
<form id="weebly-signup">
<div class="caret"></div>
<div id="signup-inputs">
<div
id="weebly-email"
class="large block"
placeholder="Email"
/>
<div
id="weebly-new-password"
class="large block"
placeholder="Password"
/>
</div>
<div class="submit-btns">
</div>
<input type="hidden" name="response" id="weebly-login-signup-response" />
<input type="hidden" name="weebly-campaign" id="weebly-campaign" value="" />
</form>
</div> <!-- #sidebar-inner -->
</div> <!-- #sidebar -->
<div id="login-box" class="form-popover-box titled-box">
<form id="weebly-login" method="post" action="https://www.weebly.com/weebly/login.php">
<div class="caret"></div>
<input
type="text"
id="weebly-username"
class="large block"
name="user"
placeholder="Email or Username"
value=""
/><br>
<input
type="password"
id="weebly-password"
class="large block"
name="pass"
placeholder="Password"
/><br>
<p class="remember-me">
<label>
<input
type="checkbox"
id="weebly-remember"
name="rememberme"
checked
/>
</label>
</p>
</form>
</div>
<div id="how-it-works" class="section">
<div class="hgroup">
<h2> Tips to work on Seating Application</h2>
</div>
<div class="article">
<ol id="how-it-works-list">
<li class="tips top">
<div class="content"><span class="icon"></span></div>
</li>
<li>
<h4> Master</h4>
<div class="content">
<span class="talkbubble"><span class="icon grow"></span></span>
<span class="circle mask"><span class="icon grow" ></span></span>
<ul class="bubble">
<li> Exam name,month and year is created in exam master </li>
<li> Course code and name is created in course master</li>
<li> Subject code and name is created in subject master</li>
<li> Room details such room name,no of benches,maximum bench capacity,available status and invigilator is created in room master</li>
</ul>
</div>
<br><br><br><br> <br><br><br><br><br><br><br>
</li>
<li>
<h4> Details</h4>
<div class="content">
<span class="talkbubble"><span class="icon create"></span></span>
<span class="circle mask"><span class="icon create"></span></span>
<ul class="bubble">
<li> Course code and Subject code is created in course subject</li>
<li> Exam name and course code is created in exam course</li>
<li> Register no,name, course code and Subject code for a particular exam is created </li>
<li> Update the course code ,subject code,date and session for particular exam </li>
</ul>
</div>
<br><br><br><br> <br><br><br><br><br>
</li>
<li>
<h4> Seating Plan </h4>
<div class="content">
<span class="talkbubble"><span class="icon publish"></span></span>
<span class="circle mask"><span class="icon publish"></span></span>
<ul class="bubble">
<li> Exam name is selected </li>
<li> Date and session is selected </li>
<li> Course code,Subject code and number of student id displayed </li>
<li> Clicking on System generated it displays seat no ,register no and subject code</li>
</ul>
</div>
<br><br><br><br> <br><br><br>
</li>
<li>
<h4> Seating Report </h4>
<div class="content">
<span class="talkbubble"><span class="icon grow"></span></span>
<span class="circle mask"><span class="icon grow"></span></span>
<ul class="bubble">
<li> Exam name is selected </li>
<li> Date and session is selected </li>
<li> Course code,Subject code and number of student id displayed </li>
<li> Selecting on the Subject code it display Room no,seat no,register no and invigilator as report </li>
<li> Clicking on seating summary it displays exam name ,date,session,room no,subject code,register no ,no of students and invigilator</li>
</ul>
</div>
<br><br><br><br> <br><br><br><br><br>
</li>
<li>
<h4> Upload</h4>
<div class="content">
<span class="talkbubble"><span class="icon grow"></span></span>
<span class="circle mask"><span class="icon grow"></span></span>
<ul class="bubble">
<li> Exam name is selected </li>
<li> Course code for relevant exam is selected </li>
<li> Subject code for corresponding course code is selected </li>
<li> Choose the csv file which has register no and students name and upload it </li>
</ul>
</div>
<br><br><br><br> <br><br><br><br><br>
</li>
<li class="tips bottom">
<div class="content"><span class="icon"></span></div>
</li>
</ol>
</div>
</div>
<script>
function showorhide(id){
if(document.getElementById(id)){ //check the element exists and can be accessed
var ele = document.getElementById(id); //get hold of the element
if(ele.style.display=="none"){ //see if display property is set to none
ele.style.display="block";
}else{
ele.style.display="none";
}
}
}
</script>
<script>
$('#showhide').hide();
</script>
<style>
.talkbubble {
width: 120px;
height: 80px;
background:#339900;
position: relative;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
.talkbubble:before {
position: absolute;
right: 100%;
top: 26px;
width: 0;
height: 0;
border-top: 13px solid transparent;
border-right: 26px solid red;
border-bottom: 13px solid transparent;
}
span.picture1 {
width:100px; /*width of your image*/
height:100px; /*height of your image*/
background-image:url('C:\wamp\www\seatingreport1\img\refresh.jpg');
margin:0; /* If you want no margin */
padding:0; /*if your want to padding */
}
</style>
I do believe that site_url doesn't work this way. The function will guess your domain and prepend it to the argument you give. You should try :
site_url("seatingreport4/index.php/help");
It will generate the following
http://localhost/seatingreport4/index.php/help
Or just write without the site_url function
file_get_contents("http://localhost/seatingreport4/index.php/help");
You can use mPDF for generating PDF in Codeigniter.
You can create a controller class and then create function in it. And then do something as bellow code -
public function mypdf() {
$this->load->library('pdf');
$pdf = $this->pdf->load();
$html=$this->load->view('welcome_message',null,true);
$pdf->WriteHTML($html);
// write the HTML into the PDF
$output = 'itemreport' . date('Y_m_d_H_i_s') . '_.pdf';
$pdf->Output("$output", 'I');
}
For more detail you can see the tutorial on mPDF codeigniter here.
I have a button that I want to open a panel. Unfortunately my javascript is getting in the way. It's a notifications center in the panel and in order to retrieve the notifications I have to put javascript in the href of the link....but its not opening the open.
I put tags where the problem is that say THIS IS WHERE THE PROBLEM LIES.
If I change the href to #myContent then it will open, but in order for the script to work I need to to be javascript in the href.
Here's my code:
<? //PHP for getting username and database here ?>
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
function toggleDiv(divId) {
$("#"+divId).toggle();
$(document).ready(function(){
$("#myContent").load("getnotes.php?name=<? echo $username; ?>");
});
}
</script>
<!-- BEGIN PAGE 1 -->
<div data-role="page" id="feed" data-add-back-btn="true">
<div data-role="panel" id="settingspanel" data-position="left" data-display="overlay">
<!--THIS IS THE LEFT PANEL-->
</div>
<div data-role="header" data-position="fixed" data-theme="c" data-tap-toggle="false" data-id="foo1" style="padding-top: 5px; border-bottom: 1px solid #eccfb3; padding-bottom: 5px;">
<center><img src="images/logo_app_white.png" height="25px"></center>
<!--THIS IS WHERE THE PROBLEM LIES-->
<? echo $number; ?>
</div>
<div data-role="content">
<!--This is where the content of the page goes-->
</div>
<div data-role="footer" data-position="fixed" data-theme="c" data-tap-toggle="false" data-id="foo1" style="border-top: 1px solid #eccfb3; padding-top: 5px;">
<div data-role="navbar" style="background: #ce8339;">
<ul>
<li>My Feed</li>
<li>Submit</li>
<li>Browse</li>
<li>Projects</li>
</ul>
</div>
<!-- /navbar -->
</div>
<div data-role="panel" id="myContent" data-position="right" data-display="overlay">
<!--THIS IS THE PANEL-->
</div>
</div>
<!-- END PAGE 1 -->
Why isn't the panel opening and how can I fix the issue.
Why put javascript in the 'href' tag and not in 'onclick'?
My guess is
<a href="javascript:void(0);" onclick="toggleDiv('myContent');">
will fix the issue.