Div tag problem

Phatsta · April 21, 2010

Hi everybody,

I've stared at this code for 4 hours straight, trying different approaches but I can't figure out why I'm getting the space between the top and middle, like this:

User input site

Also, I'm wondering about another thing. When using forms, is it possible to use the same input name more than once? Like in the above site where I use several rows, but the info is going to the same tables (in the sql) row by row. This is so that the user can input several rows at once. Here's the code:

<!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" lang="sv">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Intendo tidsregistrering</title>
<style type="text/css" media="all">
<!--
@import url("http://www.falloutdata.se/intendo/images/css/template_css.css");
-->
#apDiv1 {
position:relative;
left:65px;
top:30px;
width:874px;
height:900px;
z-index:8;
text-align:left;
}
</style>
</head>
<body>
<div class="paper_top"><img src="http://www.falloutdata.se/intendo/images/papertop.png" width="1004" />
</div>
<div class="paper">
<div id="apDiv1">
 <p><font size="+2"><b>Tidsregistrering</b></font></p>
 <p> </p>
<table border=0 cellspacing=0 cellpadding=0 width=100% bordercolor='#0000ff' align="center">
 <tr>
   <td width="75">Från datum</td>
   <td width="75">Till datum</td>
   <td width="47">Från kl</td>
   <td width="53">Till kl</td>
   <td width="45">Projekt</td>
   <td width="48">Kundnr</td>
   <td width="165">Kundnamn</td>
   <td width="164">Benämning</td>
   <td width="45">Prodnr</td>
   <td width="53">Frånvaro typ</td>
   <td width="49">Upplupet tim</td>
   <td width="55">Antal tim</td>
 </tr>
</table>

<?php
$link = mysql_connect("localhost","falloutdata_se","sjUqTVH2");
mysql_select_db("falloutdata_se.visma");

if (isset($_POST['submit'])) {

     $frdat = $_POST['frdat'];
     $tilldat = $_POST['tilldat'];
     $frkl = $_POST['frkl'];
  $tillkl = $_POST['tillkl'];
  $projekt = $_POST['projekt'];
  $kundnr = $_POST['kundnr'];
  $kundnamn = $_POST['kundnamn'];
  $ben = $_POST['ben'];
  $prodnr = $_POST['prodnr'];
  $frvtyp = $_POST['frvtyp'];
  $upptim = $_POST['upptim'];
  $anttim = $_POST['anttim'];

     $sql = "INSERT INTO database (frdat, tilldat, frkl, tillkl, projekt, kundnr, kundnamn, ben, prodnr, frvtyp, upptim, anttim) VALUES ('$frdat', '$tilldat', '$frkl', '$tillkl', '$projekt', 		'$kundnr', '$ben', '$prodnr', '$frvtyp', '$upptim', '$anttim')";

  $result = mysql_query($sql) or die(mysql_error());
}
?>

<form name="input" method="post"> 
<table width=100% border=0 align="center" cellpadding=0 cellspacing=1> 
<tr> 
<td bordercolor="#000000" bgcolor="#FFFFFF">
<input type="textbox" name="frdat" size="7" style="border: 1px solid #000000">
<input type="text" name="tilldat" value="" size="7" border="1" style="border: 1px solid #000000"> 
<input type="text" name="frkl" value="" size="3" border="1" style="border: 1px solid #000000">
<input type="text" name="tillkl" value="" size="3" border="1" style="border: 1px solid #000000"> 
<input type="text" name="projekt" value="" size="2" border="1" style="border: 1px solid #000000"> 
<input type="text" name="kundnr" value="" size="3" border="1" style="border: 1px solid #000000"> 
<input name="kundnamn" type="text" value="" size="24" border="1" style="border: 1px solid #000000">
<input type="text" name="ben" value="" size="24" border="1" style="border: 1px solid #000000">
<input type="text" name="prodnr" value="" size="2" border="1" style="border: 1px solid #000000">
<input type="text" name="frvtyp" value="" size="3" border="1" style="border: 1px solid #000000">
<input type="text" name="upptim" value="" size="4" border="1" style="border: 1px solid #000000">
<input type="text" name="anttim" value="" size="3" border="1" style="border: 1px solid #000000"> 
</td>
</tr>
<tr>
<td>
<input name="Submit" type="Submit" class="button_td" value="Skicka">
</td>
</tr>
</table>
</form>
</div>
</div>
<div class="footer_bottom">
 <img src="http://www.falloutdata.se/intendo/images/paperbottom.png" align="top" />
</div>
</body>
</html>

I've shortened it as you can see. In the original I've copy/pasted the input fields so it looks the same.

Thanks for your effort!

falkencreative · April 21, 2010

The gap is caused by the top margin on the first <p> tag withing div#apDiv1. You can fix this by removing the top margin from the <p> tag, or adding "overflow:auto" to div#apDiv1.

No, you have to use unique names for input elements -- otherwise when you grab them with PHP there may be confusion, and PHP will only grab the data from one of the input elements, not all of them.

virtual · April 21, 2010

To rectify the gap at the top in .paper set margin-top to -6px. Only checked in FF

Sign In

Div tag problem

Recommended Posts

Phatsta

Link to comment

Share on other sites

falkencreative

Link to comment

Share on other sites

virtual

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Store

Support