[CSS/IE6] hidden input ruimte

[bastv]

html voorbeeld:

HTML:

<tr>
<td class="even" align="left" nowrap>PVKP  </td>
<td class="even" align="left" nowrap>
<a href="../dms/bestanden/e345a6c924ce51398f3d7d7359c16781.doc" target="_blank">blaat.doc</a>
</td>
<td class="even" align="center">
<img src="../images/icons/filetypes/word.gif" alt="Word Document">
<td class="even" align="left">1</td>
<td class="even" align="left" nowrap>10-1-2006</td>
<td class="even" align="left" nowrap>.</td>
<td class="even" align="left" nowrap>8-5-2006</td>
<td class="even" align="left">389 KB</td>
<td class="even" align="center">
<a href="../dms/upload.asp?filehash=e345a6c924ce51398f3d7d7359c16781&fileversion=1&category_id=13&comment=" target="_blank">
<img src="../images/icons/upload.gif" alt="NIEUWE VERSIE uploaden" border="0"></a>
</td>
    <form name="buttondelete" method="post" action="default2.asp">
    <input type="hidden" name="hash" value="e345a6c924ce51398f3d7d7359c16781">
    <input type="hidden" name="categoryid" value="13">
    <input type="hidden" name="zoekarg" value="ADCO">
    <input type="hidden" name="uploader" value="nvt">
    <input type="hidden" name="filetype" value="nvt">
    <input type="hidden" name="Volgorde" value="UploadDatum">
    <input type="hidden" name="extension" value="doc">
    <input type="hidden" name="dateuploaded" value="8-5-2006">
    <input type="hidden" name="LaatsteVersie" value="Ja">
    <input type="hidden" name="action" value="verwijderen">
    <td class="even" align="center">
    <a href="../dms/edit.asp?filehash=e345a6c924ce51398f3d7d7359c16781&file_version=1&category_id=13&comment=&file_name=blaat.doc&date_file=10-1-2006" target="_blank">
    <img src="../images/icons/edit.gif" alt="Bestand bewerken" border="0"></a>
    </td>
    <td class="even" align="center">
    <input type="image" src="../images/icons/delete.gif" class="nostyle" alt="verwijderen" value="verwijderen">
    </td>
    </form>
</tr>

hier zitten dus veel hidden input fields in. Hier loop ik met een script doorheen en kan dus 20 keer op een pagina staan.
Internet explorer neemt dan een ruimte in voor die hidden inputs bovenaan de pagina.
Hoe meer resultaten hoe meer ruimte er bovenaan de pagina komt te staan.
Dit is alleen met IE6 en niet met IE7/Firefox

de css:

Cascading Stylesheet:

form{padding: 0px;margin:0px;background-color: yellow;}
input {background:#f0f0f0;border:1px solid #b0b0b0; font-size: 8pt; color: #201B82;}
input[type=hidden] {  height: 0px;  width: 0px;  visibility: hidden;  display: none;}
input[type=image] {border:0px;background:transparent;}
input.nostyle {border:0px;background:transparent;}

screenshot (het gele is dus de ruimte die IE6 toevoegd)


Is dit op te lossen met CSS?

[Verwijderd]

Je kunt zulke verbergingen ook verbergen met PHP

[ Voor 224% gewijzigd door Verwijderd op 07-05-2016 09:37 . Reden: (al hoe wel dat ≠ de taal is waar het hier over gaat) ]

[user109731]

IE6 ondersteunt idd geen attribuut-selectors als "input[type=hidden]"... Een hele simpele oplossing is, als ze allemaal bij elkaar staan, er een divje omheen zetten, zodat je dan zoiets kan doen:

Cascading Stylesheet:

div.hidden input {
  display:none;
}

Als ze niet allemaal bij elkaar staan zul je bij elke (hidden) input een class toe moeten voegen. Maar ik denk niet echt dat dit alles nodig is, want een hidden input is echt hidden volgens mij...

Misschien dat het door de whitespace voor en na de inputs komt, haal die eens weg?

[ Voor 23% gewijzigd door user109731 op 12-10-2006 10:18 ]

[disjfa]

Ik denk niet dat de hidden fields je probleem is. Die worden namelijk niet gerendert.

IE wilt wel graag spelen met spaties en enters.

[bastv]

zijn wel de hidden inputs als ik die weg haal gaat het wel goed.
het is maar 1px per TR maar als je 20 keer doorheen loopt krijg je een ruimte van 20px bovenaan de table.

Grote prutser schreef op donderdag 12 oktober 2006 @ 10:12:
IE6 ondersteunt idd geen attribuut-selectors als "input[type=hidden]"... Een hele simpele oplossing is, als ze allemaal bij elkaar staan, er een divje omheen zetten, zodat je dan zoiets kan doen:

Cascading Stylesheet:

div.hidden input {
  display:none;
}

Als ze niet allemaal bij elkaar staan zul je bij elke (hidden) input een class toe moeten voegen. Maar ik denk niet echt dat dit alles nodig is, want een hidden input is echt hidden volgens mij...

Misschien dat het door de whitespace voor en na de inputs komt, haal die eens weg?

komt ook niet door de whitspaces na de inputs en een input hidden is echt hidden maar IE6 reserveert tog echt een ruimte bovenaan de table (zie screenshot)

[Exterazzo]

Als je van dit:

code:

<input type="hidden" name="hash" value="e345a6c924ce51398f3d7d7359c16781"> 
    <input type="hidden" name="categoryid" value="13"> 
    <input type="hidden" name="zoekarg" value="ADCO"> 
    <input type="hidden" name="uploader" value="nvt"> 
    <input type="hidden" name="filetype" value="nvt"> 
    <input type="hidden" name="Volgorde" value="UploadDatum"> 
    <input type="hidden" name="extension" value="doc"> 
    <input type="hidden" name="dateuploaded" value="8-5-2006"> 
    <input type="hidden" name="LaatsteVersie" value="Ja"> 
    <input type="hidden" name="action" value="verwijderen">

Nou dit maakt:

code:

<input type="hidden" name="hash" value="e345a6c924ce51398f3d7d7359c16781"><input type="hidden" name="categoryid" value="13"><input type="hidden" name="zoekarg" value="ADCO"><input type="hidden" name="uploader" value="nvt"><input type="hidden" name="filetype" value="nvt"><input type="hidden" name="Volgorde" value="UploadDatum"><input type="hidden" name="extension" value="doc"><input type="hidden" name="dateuploaded" value="8-5-2006"><input type="hidden" name="LaatsteVersie" value="Ja"><input type="hidden" name="action" value="verwijderen">

(maw alle hidden inputs op 1 regel)
En de ruimte boven in wordt dan kleiner, dat ligt het wel degelijk aan de spaces/enters.

[crisp]

Je HTML is compleet invalid, <tr> mag enkel <td> of <th> bevatten

[Verwijderd]

zet ze gewoon eens tussen <td> en </td> dan zul je ze niet meer zien.

[Savantas]

Laat maar, hierboven al genoeg tips...

[ Voor 83% gewijzigd door Savantas op 12-10-2006 10:58 ]

[bastv]

Verwijderd schreef op donderdag 12 oktober 2006 @ 10:43:
zet ze gewoon eens tussen <td> en </td> dan zul je ze niet meer zien.

dan is het inderdaad weg maar dan word alles een stuk breder

crisp schreef op donderdag 12 oktober 2006 @ 10:42:
Je HTML is compleet invalid, <tr> mag enkel <td> of <th> bevatten

aangepast maar heeft niet geholpen

Exterazzo schreef op donderdag 12 oktober 2006 @ 10:42:
Als je van dit:

code:

<input type="hidden" name="hash" value="e345a6c924ce51398f3d7d7359c16781"> 
    <input type="hidden" name="categoryid" value="13"> 
    <input type="hidden" name="zoekarg" value="ADCO"> 
    <input type="hidden" name="uploader" value="nvt"> 
    <input type="hidden" name="filetype" value="nvt"> 
    <input type="hidden" name="Volgorde" value="UploadDatum"> 
    <input type="hidden" name="extension" value="doc"> 
    <input type="hidden" name="dateuploaded" value="8-5-2006"> 
    <input type="hidden" name="LaatsteVersie" value="Ja"> 
    <input type="hidden" name="action" value="verwijderen">

Nou dit maakt:

code:

<input type="hidden" name="hash" value="e345a6c924ce51398f3d7d7359c16781"><input type="hidden" name="categoryid" value="13"><input type="hidden" name="zoekarg" value="ADCO"><input type="hidden" name="uploader" value="nvt"><input type="hidden" name="filetype" value="nvt"><input type="hidden" name="Volgorde" value="UploadDatum"><input type="hidden" name="extension" value="doc"><input type="hidden" name="dateuploaded" value="8-5-2006"><input type="hidden" name="LaatsteVersie" value="Ja"><input type="hidden" name="action" value="verwijderen">

(maw alle hidden inputs op 1 regel)
En de ruimte boven in wordt dan kleiner, dat ligt het wel degelijk aan de spaces/enters.

ook dit heeft niet geholpen

[ Voor 52% gewijzigd door bastv op 12-10-2006 11:00 ]

[disjfa]

Hoe zit je html nu inelkaar dan?

[skabouter]

probeer ook eens je form display op inline te zetten (staat standaard op block)

[Skaah]

crisp schreef op donderdag 12 oktober 2006 @ 10:42:
Je HTML is compleet invalid, <tr> mag enkel <td> of <th> bevatten

Inderdaad, als je meerdere forms wilt moet je je tabel opsplitsen.