Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
115 views
in Technique[技术] by (71.8m points)

html - Unwanted space at the top each time I add more tables using php

Can some one help me on why there is a space occuring on the site everytime I add up a table. This is what it looks like at the first table.

enter image description here

Here is the first code where there is no space at the top:

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
h1 {text-align: left;
    border-bottom-style: solid;
    border-bottom-color: #1C2833;}
body {
    font-family: "American Typewriter",serif;
    background-color:#E6D1D9;
}
/*side navigation menu*/
.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #49000E;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 50px;
}
/* menu links*/
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 15px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidenav a:hover {
  color: #F8EDF1 ;
}

.sidenav .closebtn {
  position: absolute;
  top: 10px;
  right: 5px;
  font-size: 30px;
  margin-left: 50px;
}

}
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
</style>
</head>

<body>
<div id="mySidenav" class="sidenav" style="font:5px/15px New Century Schoolbook, TeX Gyre Schola, serif;color:#340D0D">
            <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
            <ul><li><a href="lab1.php">Lab 1: Hello World</a></li><li>
            <a href="lab2.php">Lab 2: Basic PHP Script</a></li><li>
            <a href="lab3.php">Lab 3: Working with Data Types and Operators</a></li><li>
            <a href="lab4.php">Lab 4</a></li><li>
            <a href="lab6.php">Lab 6</a></li><li>
            <a href="lab7.php">Lab 7</a></li><li>
            <a href="lab8.php">Lab 8</a></li><li>
            <a href="lab9.php">Lab 9</a></li><li>
            <a href="lab10.php">Lab 10</a></li><li>
            <a href="lab11.php">Lab 11</a></li><li>
            <a href="lab12.php">Lab 12</a></li><li>
            <a href="lab13.php">Lab 13</a></li><li>
            <a href="lab14.php">Lab 14</a></li><li>
            <a href="lab15.php">Lab 15</a></li><li>
            <a href="lab16.php">Lab 16</a></li></ul>  
</div>
<?php 
define('LABTITLE', 'Laboratory Activity No. 3');
define('DESCRIPTION', 'Working with Data Types and Operators');
?>

<div style ='font:21px/31px New Century Schoolbook, TeX Gyre Schola, serif;color:#7B000B';cursor:pointer" onclick="openNav()">&#9776; THE LIST OF LABORATORIES </div>

<script>
function openNav() {
  document.getElementById("mySidenav").style.width = "250px";
}

function closeNav() {
  document.getElementById("mySidenav").style.width = "0";
}
</script> 

<?php
echo DESCRIPTION;
$myinteger = 10;
$myfloat = 10.57;
$mystring = "10 apples";
$myboolean = TRUE;
$mynull = NULL;
$myarray = array(1,2,3);
echo "<table border ='.5' width = '1000' cellspacing ='0'>";
// 1
echo '<tr bgcolor = "#E98195"><td><B>1. PHP Data Types </B><br></td></tr>';
echo '<tr><td>1a. $myinteger</td><td>', var_dump($myinteger), '</td></tr>';
echo '<tr><td>1b. $myfloat</td><td>', var_dump($myfloat), '</td></tr>';
echo '<tr><td>1c. $mystring</td><td>', var_dump($mystring), '</td></tr>';
echo '<tr><td>1d. $myboolean</td><td>', var_dump($myboolean), '</td></tr>';
echo '<tr><td>1e. $mynull</td><td>', var_dump($mynull), '</td></tr>';
echo '<tr><td>1f. $myarray</td><td>', var_dump($myarray), '</td></tr>';
echo "</table>";
?>
<title><?php echo LABTITLE; ?></title>
</body>
</html>
question from:https://stackoverflow.com/questions/65829102/unwanted-space-at-the-top-each-time-i-add-more-tables-using-php

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

You have too many br tags in your tables - between the table tags (tr / td / th / table) other tags are not allowed - removing them the problem is solved.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...