Hallo beste redder in nood,
ik ben ondertussen vaste klant geworden op dit forum, maar goed. Twee vragen dus. Ik ben bezig met een online form. Het form werkt met tabbladen. Het gekke is alleen dat de tabs in Firefox mooi op de Div eronder aansluiten, maar dat er in Explorer een ruimte onststaat van ongeveer 5 pixels.
Ten tweede, ik heb de forms in tables gestopt die netjest in divs zitten (genaamd Questions en Answers). Nu wil het geval dat als ik het bestand open in firefox de tables niet op gelijke hoogte weergegeven worden. Ik snap er echt niks meer van.
Heeft iemand hier een antwoord op?
met vriendelijke groet,
Sjoerd Oudman
ps: de code
HTML:
<body><center>
<div id="header"><div id="headerleft"><img src="images/lyfestyle2.jpg" /></div>
<div id="headerright"><img src="images/lyfestyle3.jpg" /></div>
</div>
<div id="scrollbalk"><a href="#"><img src="images/pagina1.jpg" /></a><a href="#"><img src="images/pagina_pink2.jpg" /></a><a href="#"><img src="images/pagina_pink3.jpg" /></a>
</div>
<div id="container">
<div id="content"><div id="form"><div id="Answers">
<form id="form1" name="form1" method="post" action="cgi-bin/contact.cgi"><table width="100%" height="330" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"> <input type="radio" name="sex" value="male" />
<span class="style5">man</span>
<input type="radio" name="sex" value="female" />
<span class="style5">vrouw</span></td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"><input type="text" name="age" size="3" id="age" maxlength="3" />
<span class="style4">x</span>jaar</td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"><input type="text" name="profession" size="40" id="profession" maxlength="50" /></td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"><input type="text" name="education" size="40" id="education" maxlength="50" /></td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td width="33%"><input type="radio" name="vraag5" value="fantastisch" />
Fantastisch <br />
<input type="radio" name="vraag5" value="Vreselijk" />
Vreselijk </td>
<td width="67%" height="60"><input type="radio" name="vraag5" value="Watishedendaagsekunst" />
Wat is hedendaagse kunst? <br />
<input type="radio" name="vraag5" value="geenmening" />
Geen mening </td>
</tr>
</table>
</form>
</div> <strong>Vul het formulier zo volledig mogelijk in! Onvolledige formulieren <br />
kunnen wij helaas niet in behandeling nemen.<br /><br /></strong>
<div id="Questions">
<table width="100%" height="330" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="29%" height="30"><h1 class="style1">Vraag 1:</h1></td>
</tr>
<tr>
<td height="30">geslacht</td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 2:</h1></td>
</tr>
<tr>
<td height="30">Wat is uw leeftijd? </td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 3:</h1></td>
</tr>
<tr>
<td height="30">Wat is uw beroep? </td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 4:</h1></td>
</tr>
<tr>
<td height="30">Wat is uw hoogst genoten opleiding?</td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 5:</h1></td>
</tr>
<tr>
<td height="60">Wat vindt u van de hedendaagse beeldende kunst? </td>
</tr>
</table>
</div>
</div></div>
<div id="nextpage"><a href="formulier2.html">volgende pagina>></a></div>
</div>
</center>
</body>
</html>
de Css
#header {
height:117px;
width:80%;
text-align:left;
position:relative;
}
#headerright {
height:117px;
width:100%;
left:0px;
top:0px;
text-align:right;
position:absolute
}
#headerleft {
height:117px;
width:100%;
left:0px;
top:0px;
text-align:left;
position:absolute
}
#scrollbalk {
height:20px;
width:80%;
text-align:left;
position:relative;
border:none;
}
#scrollbalk a img {
margin-right:2px;
border:none;
margin-bottom:0px;
}
#container {
margin-top:0px;
height:500px;
width:80%;
background-color:#663366;
position:relative;
border:none;
}
#nextpage {
height:30px;
position:absolute;
top:470px;
width:98%;
left:1%;
font:Arial, Helvetica, sans-serif;
font-size:18px;
text-align:center;
}
#content {
height:460px;
width:98%;
left:1%;
top:5px;
position:absolute;
background-color:#FFFFFF;
}
#form {
height:375px;
width:94%;
left:3%;
top:30px;
position:absolute;
background-color:#FFFFFF;
text-align:left;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:normal;
}
#Questions {
height:330px;
width:29%;
position:absolute;
left:0%;
top:45px;
}
#Answers {
height:330px;
width:71%;
left:29%;
position:absolute;
top:45px;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
}
ik ben ondertussen vaste klant geworden op dit forum, maar goed. Twee vragen dus. Ik ben bezig met een online form. Het form werkt met tabbladen. Het gekke is alleen dat de tabs in Firefox mooi op de Div eronder aansluiten, maar dat er in Explorer een ruimte onststaat van ongeveer 5 pixels.
Ten tweede, ik heb de forms in tables gestopt die netjest in divs zitten (genaamd Questions en Answers). Nu wil het geval dat als ik het bestand open in firefox de tables niet op gelijke hoogte weergegeven worden. Ik snap er echt niks meer van.
Heeft iemand hier een antwoord op?
met vriendelijke groet,
Sjoerd Oudman
ps: de code
HTML:
<body><center>
<div id="header"><div id="headerleft"><img src="images/lyfestyle2.jpg" /></div>
<div id="headerright"><img src="images/lyfestyle3.jpg" /></div>
</div>
<div id="scrollbalk"><a href="#"><img src="images/pagina1.jpg" /></a><a href="#"><img src="images/pagina_pink2.jpg" /></a><a href="#"><img src="images/pagina_pink3.jpg" /></a>
</div>
<div id="container">
<div id="content"><div id="form"><div id="Answers">
<form id="form1" name="form1" method="post" action="cgi-bin/contact.cgi"><table width="100%" height="330" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"> <input type="radio" name="sex" value="male" />
<span class="style5">man</span>
<input type="radio" name="sex" value="female" />
<span class="style5">vrouw</span></td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"><input type="text" name="age" size="3" id="age" maxlength="3" />
<span class="style4">x</span>jaar</td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"><input type="text" name="profession" size="40" id="profession" maxlength="50" /></td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td height="30" colspan="2"><input type="text" name="education" size="40" id="education" maxlength="50" /></td>
</tr>
<tr>
<td height="30" colspan="2"> </td>
</tr>
<tr>
<td width="33%"><input type="radio" name="vraag5" value="fantastisch" />
Fantastisch <br />
<input type="radio" name="vraag5" value="Vreselijk" />
Vreselijk </td>
<td width="67%" height="60"><input type="radio" name="vraag5" value="Watishedendaagsekunst" />
Wat is hedendaagse kunst? <br />
<input type="radio" name="vraag5" value="geenmening" />
Geen mening </td>
</tr>
</table>
</form>
</div> <strong>Vul het formulier zo volledig mogelijk in! Onvolledige formulieren <br />
kunnen wij helaas niet in behandeling nemen.<br /><br /></strong>
<div id="Questions">
<table width="100%" height="330" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="29%" height="30"><h1 class="style1">Vraag 1:</h1></td>
</tr>
<tr>
<td height="30">geslacht</td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 2:</h1></td>
</tr>
<tr>
<td height="30">Wat is uw leeftijd? </td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 3:</h1></td>
</tr>
<tr>
<td height="30">Wat is uw beroep? </td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 4:</h1></td>
</tr>
<tr>
<td height="30">Wat is uw hoogst genoten opleiding?</td>
</tr>
<tr>
<td height="30"><h1 class="style1">Vraag 5:</h1></td>
</tr>
<tr>
<td height="60">Wat vindt u van de hedendaagse beeldende kunst? </td>
</tr>
</table>
</div>
</div></div>
<div id="nextpage"><a href="formulier2.html">volgende pagina>></a></div>
</div>
</center>
</body>
</html>
de Css
#header {
height:117px;
width:80%;
text-align:left;
position:relative;
}
#headerright {
height:117px;
width:100%;
left:0px;
top:0px;
text-align:right;
position:absolute
}
#headerleft {
height:117px;
width:100%;
left:0px;
top:0px;
text-align:left;
position:absolute
}
#scrollbalk {
height:20px;
width:80%;
text-align:left;
position:relative;
border:none;
}
#scrollbalk a img {
margin-right:2px;
border:none;
margin-bottom:0px;
}
#container {
margin-top:0px;
height:500px;
width:80%;
background-color:#663366;
position:relative;
border:none;
}
#nextpage {
height:30px;
position:absolute;
top:470px;
width:98%;
left:1%;
font:Arial, Helvetica, sans-serif;
font-size:18px;
text-align:center;
}
#content {
height:460px;
width:98%;
left:1%;
top:5px;
position:absolute;
background-color:#FFFFFF;
}
#form {
height:375px;
width:94%;
left:3%;
top:30px;
position:absolute;
background-color:#FFFFFF;
text-align:left;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:normal;
}
#Questions {
height:330px;
width:29%;
position:absolute;
left:0%;
top:45px;
}
#Answers {
height:330px;
width:71%;
left:29%;
position:absolute;
top:45px;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
}
