php error message affecting height of textboxes - php

I'm using php to display an error message to the user. The code is sitting at the top of the page and once the error message displays, it affects the height of my textboxes. I coded the height in a style sheet. Also, my error message is sitting inside of a div. I tried using the span tag but that isn't working either since its still sitting at the top line of the page. This is the error message in php:
if($result != "")
{
echo "<div id='Error'>";
echo "<b>The following errors occured:</b><br>";
echo $result;
echo "</div>";
}
Registration div css:
#RegBody
{
background-color: white;
background-image: url(LilyPads.jpg);
height: 82.7vh;
}
#RegContents
{
position: absolute;
margin: 39px auto 0 402px;
border-radius: 20px;
background-color: white;
width: 500px;
height: 455px;
padding-left: 57px;
}
#RegisterUser
{
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 15px;
margin-top: 14px;
margin-left: 112px;
color: #1A3D5B;
width: 215px;
height: 30px;
color: white;
background-color: #1A3D5B;
border-color: #1A3D5B;
border-style: solid;
border-radius: 20px;
}
Error message css:
#Error
{
position: absolute;
background-color: white;
border: 2px solid red;
border-radius: 20px;
width: 200px;
padding: 15px;
margin: 147px 0 0 70px;
color: red;
}
Here's the css for the textboxes:
input[type='text']
{
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
text-indent: 10px;
width: 210px;
height: 25px;
border-color: #1A3D5B;
border-style: solid;
border-radius: 20px;
}
Before the error message:
I was thinking that maybe its the font size that's the issue but regardless...a white line also appears at the bottom of the page:
Please have patience with me. I'm a student and new to php. Thank you

i can tell you how to rectify the error (though i am still looking for the reason because of which it happens).
what i did is that i inserted the php code inside body tag and it work fine no change in Textbox dimensions.Below is the code i wrote to prove the same
<?php
$result=1;
echo "<div id='Error'>";
echo "<b>The following errors occured:</b><span>";
echo $result;
echo "</span></div>";
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
input[type='text']
{
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
text-indent: 10px;
width: 210px;
height:25px;
border-color: #1A3D5B;
border-style: solid;
border-radius: 20px;
}
</style>
</head>
<body>
<input type='text' name=''>
</body>
</html>

Related

Whole div a clickable link [duplicate]

This question already has answers here:
Make a div into a link
(30 answers)
Closed 2 years ago.
I am trying to get my whole div a clickable link but I am not sure the correct way to do it. Would anyone be able to help me with this, it would be greatly appreciated. I am new to coding so I am still learning proper coding. Thanks.
.container {
display: flex;
margin: auto;
width: 1052px;
}
.container>div {
background-color: #ffffff;
border: 1px solid #aaaaaa;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
flex: 1;
/*grow*/
height: 210px;
margin: 45px 10px 0px 10px;
width: 231px;
}
.container img {
height: 140px;
width: 241px;
}
.container>div a {
color: #353748;
display: block;
font-family: Netflix Sans, Helvetica, Arial, sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 20px;
padding: 5px 10px 5px 10px;
text-decoration: none;
text-overflow: ellipsis;
text-transform: initial;
}
.container>div a:hover {
color: #353748;
display: block;
font-family: Netflix Sans, Helvetica, Arial, sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 20px;
padding: 5px 10px 5px 10px;
text-decoration: underline;
text-overflow: ellipsis;
text-transform: initial;
}
<div class="container">
<div>
<img src="https://capebretonstartpage.com/1/wire-31023566-1595346165-638_636x382.jpg">
About vAdd An Image Add An Image
</div>
<div>
<img src="https://capebretonstartpage.com/1/wire-31023566-1595346165-638_636x382.jpg">
About vAdd An Image Add An Image
</div>
<div>
<img src="https://capebretonstartpage.com/1/wire-31023566-1595346165-638_636x382.jpg">
About vAdd An Image Add An Image
</div>
</div>
You can put the div inside an <a> tag

can't click anything on my website, in mobile view

Google keeps giving me results based on fixing my phone, but the problem is on my website. This is a weird problem, but on a mobile device on my website, I can't click any buttons or links. desktop works fine, but mobile is having issues. I'm making this site directly on cpanel, so I don't know if there is some special code I need to add to detect mobile taps, I usually use wordpress, so I don't know a whole lot about making a website directly on mysqli. The mobile taps will work outside a container, but I need it to work inside my page container. its inside a <div> and a <pre>. I don't really understand the problem, here is what some of my code looks like:
Global Styles:
pre{
border: solid 3px #2b333d;
border-radius: 10px;
font-size: 15px;
color: #3c3d3c;
margin: 1%;
padding: 10px;
background: #eaeaea;
display: block;
font-family: monospace;
white-space: pre-wrap;
}
input{
border: solid 2px #2b333d;
border-radius: 10px;
font-size: 15px;
color: #3c3d3c;
margin: 1%;
padding: 8px;
background: #f7f7f7;
font-family: Arial, Helvetica, sans-serif;
white-space: pre-wrap;
outline: none;
display: inline-block;
}
input[type=button], input[type=submit], input[type=reset]{
border: solid 2px #142135;
border-radius: 10px;
font-size: 18px;
color: #f7f7f7;
margin: 1%;
padding: 5px 7px;
background: #5791ed;
font-family: Arial, Helvetica, sans-serif;
white-space: pre-wrap;
outline: none;
letter-spacing: 0;
display: inline-block;
}
form{
line-height: 0.2;
white-space: normal;
}
Page/Header Styles:
.page_m{
background: #fcfcfc;
width: 99.9%;
left: 0.1%;
z-index: -20;
top: 30px;
position: relative;
}
.page_inner_m{
padding: 20px;
z-index: -20;
position: relative;
font-family: Arial, Helvetica, sans-serif;
white-space: pre-wrap;
color: #2d2d2d;
letter-spacing: 0.5;
line-height: 1.55;
border: 0;
border-radius: 0;
font-size: 18px;
margin: 0;
background: none;
display: block;
}
scripts:
<?php
?>
<style>
<?php include 'header.css'; ?>
</style>
<?php
echo '<div class="page_m">';
?>
<style>
<?phpinclude 'style_m.css';?>
</style>
<?php
echo '<pre class="page_inner_m">';
//header start
echo '<div class="menu_m">';
$host = $_SERVER['HTTP_HOST'];
preg_match("/[^\.\/]+\.[^\.\/]+$/", $host, $matches);
$domain = "{$matches[0]}\n";
echo '<center class="title_m">'.$domain.'</center>';
echo '</div>';
//header end
echo '</pre></div>';
echo '</div>';
?>
Fixed it :D just needed to replace echo '<pre class="page_inner_m">'; with echo '<body class="page_inner_m">'; and replace echo '</pre></div>'; with echo '</body></div>';
I'll keep this up incase anyone else finds it helpful. switching the <pre> tag with a <body> tag solved the problem for me.

How to join 'include' in a html-document

I am trying to join the the footer-document to the index-file. But it does not work and I suspect there i something wrong with my css-file.
html {background: url("bakgrund.gif");}
/*https://pixabay.com/ Gratis bilder Creative Commons CC0*/
html { overflow-y: scroll;}
body {
background: white;
border: 1px solid #0000ff;
font-family: calibri, arial, sans-serif;
width: 750px;
margin: 25px auto;
padding: 0;
}
header {
height: 175px;
background-color: #edffff;
margin-top: -16px;
padding: 0;
}
nav {
height: 35px;
background-color: #edffff;
padding-left: 10px;
}
section {
width: 550px;
float: left;
min-height: 400px;
}
article {
width: 550px;
float: left;
background-color: yellow;
}
aside {
width: 200px;
float: right;
background-color: lightgrey;
}
footer {
clear: both;
position: relative;
height: 55px;
padding: 5px ;
text-align: center;
background-color: magenta;
}
address {
font-size: 12px;
font-style: normal;
}
/* Menykataloger */
ul {
margin: 0;
padding: 0;
}
#meny li {
display: inline;
padding: 5px 1px;
}
#meny li a {
margin: 0 5px 0 5px;
padding: 5px 15px;
text-align: center;
font-family: arial;
font-size: 13px;
font-weight: bold;
color: black;
border: 1px solid black;
border-radius: 5px;
background: yellow;
}
#meny li a:hover {
background: #CCEBFF;
color: black;
}
#meny a:link, #meny a:visited {
color: black;
text-decoration: none;
}
#meny a:active {
color: white;
}
#meny a#current {
background: white;
}
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="stil.css" type="text/css">
</head>
<body>
<nav>
<ul id="meny">
<li>Hem</li>
<li>AAA</li>
<li>BBB</li>
<li>CCC</li>
</ul>
</nav>
<section>
<h2>Huvudrubrik</h2>
<p>Huvudinnehåll</p>
<article>
<h2>Rubrik 1</h2>
<p> Innehåll 1 med rubriker</p>
</article>
<article>
<h2>Rubrik 2</h2>
<p> Innehåll 2 med rubriker
</p>
</article>
</section>
<aside>
Nyhetsbrev H-spalt
</aside>
<?php include("fot.php"); ?>
The result is wrong with the interpretation of the border. It just encircles the head and not the whole area.
I Get your problem
why dont you start your file with < ? php at begining and close it at the end
instead which you've used like this => "< ? php include("fot.php");" ?> at the end of your second file if you can see.
and save the main html file with the extension .php
trust me nothing will happen to your html code all the html contents will run fine even if you save the file in .php
and the second thing is you can include in two ways
i.e
include 'filename';
or
require 'filename'; you better include at the starting of the file
who would know if that included file may come to use right from the begining
Thanking you!
I could not understand what you are trying to do, but your problem is due to float: left for section tag. There are many alternatives to float like flex and grid,, so don't prefer float. It will cause many problems. Your problem is listed here.
There is no problem with your php.

Only show text on image when you hover - wordpress theme

I'm using this WP theme and I'm struggeling to adjust the code so that the Title and Description in the content boxes only show on hover (at the moment they're always displayed and hover just makes the image go darker).
Here are the codes in question (as far as I can tell):
.home_featured_post_last { margin-right: 0; }
.home_featured_post_hover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-decoration: none; border-radius: 5px; }
.home_featured_post_hover:hover { background: url('images/trans-back.png') repeat; text-decoration: none; border-radius: 5px; }
.home_featured_post_tbl { display: table; width: 100%; height: 100%; }
.home_featured_post_tbl_cell { display: block; text-align: center; vertical-align: middle; color: #fff; text-shadow: 1px 1px #000; font-size: 14px; font-family: Arial, Helvetica, sans-serif; color: #fff; letter-spacing: 1.5px; font-weight: 400; }
.home_featured_post_tbl_cell h3 { text-shadow: 1px 1px #000; font-size: 19px; font-family: Arial, Helvetica, sans-serif; color: #fff; letter-spacing: 1.5px; font-weight: 700; }
<a class="home_featured_post_hover" href="<?php the_permalink(); ?>">
<div class="home_featured_post_tbl">
<div class="home_featured_post_tbl_cell">
<h3><?php the_title(); ?></h3>
<p><?php echo ds_get_excerpt('40'); ?></p>
</div><!--//home_featured_post_tbl_cell-->
</div><!--//home_featured_post_tbl-->
</a><!--//home_featured_post_hover-->
As suggested in some other posts, I've tried adding visibility: hidden; and visibility: visbile; to the CSS in various different combinations but either it just hides the text completely or it doesn't work at all. Does this have to do with how the PHP code is formated? Any thoughts on how to do this?
Sorry if this is really obvious - I can't work it out.
Try adding these CSS lines... if you want a smoother effect, you can add the css transition property!
a.home_featured_post_hover .home_featured_post_tbl_cell { opacity:0; }
a.home_featured_post_hover:hover .home_featured_post_tbl_cell { opacity:1; }
What this does is basically make the title/desc div transparent, then show it when the mouse is over the link.

Warning: Cannot modify header information - headers already sent by (output) [duplicate]

This question already has answers here:
How to fix "Headers already sent" error in PHP
(11 answers)
Closed 9 years ago.
I'm getting this error again and again i try everything but i can't found solution
Warning: Cannot modify header information - headers already sent by (output started at /home/xxxx/xxxx/forum/index.php:90) in /home/pappu/public_html/forum/index.php on line 93
here is my index.php code
<?php
include_once("connect.php");
session_start();
?>
<html>
<head>
<title>MyForum</title>
<style type="text/css">
body {
background-color: #333;
margin-top: 150px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
.content {
background-color: #666;
width: 960px;
margin-right: auto;
margin-left: auto;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
padding: 20px;
}
.content .categories {
width: 700px;
background-color: #333;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
margin: 0px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #FFF;
}
.categories .community_heading {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-variant: normal;
text-transform: capitalize;
color: #CCC;
margin: 0px;
padding-top: 7px;
padding-right: 7px;
padding-bottom: 7px;
padding-left: 14px;
font-size: 18px;
font-weight: bold;
}
.content .categories hr {
background-color: #666;
height: 3px;
border: 0px;
width: 700px;
margin: 0px;
}
.content .categories .cat_links {
border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #000;
padding-top: 7px;
padding-right: 7px;
padding-bottom: 7px;
padding-left: 14px;
font-size: 14px;
color: #000;
}
.content .categories .cat_a {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 18px;
font-variant: normal;
text-transform: capitalize;
color: #777;
text-decoration: none;
}
.content .categories .cat_a:hover {
text-decoration: underline;
color: #DDD;
}
.content .categories .desc {
margin: 0px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #CCC;
}
</style>
</head>
<body>
<?php
if(!isset($_SESSION['password']))
{
include_once("Location:header.php");
}
else
{
header("Location:member.php");
}
?>
<div class="content">
<div class="categories">
<h3 class="community_heading">Community</h3>
<hr />
<?php
$query = "SELECT * FROM categories ORDER BY cat_id ASC";
$result = mysql_query($query) or die(mysql_error());
$categories = "";
if(mysql_num_rows($result) > 0 )
{
while($row = mysql_fetch_array($result))
{
$cat_id = $row['cat_id'];
$cat_title = $row['cat_title'];
$cat_desc = $row['cat_description'];
$categories .="
<div class='cat_links'>
<a href='view_category?cid=".$cat_id."' class='cat_a'>$cat_title</a>
<p class='desc'>$cat_desc</p>
</div>";
}
echo $categories ;
}
else
{
}
?>
</div>
</div>
</body>
</html>
You can't call Header() after including ANY code that is outputted to the page. You need to rewrite what you are doing so the Header() call is above all the HTML code.

Categories