Discussion :

[danyboy85]

Bonjour,

J'ai un problème d'espace blanc que j'aimerais faire disparaitre

Alors tout d'abord voici mon code html :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<table style="border:1px solid #FF0000;width:500px;" border=1>
    <tr>
        <td id="abcd">
            <div>
                <input type="text">
            </div>
            <div>
                <input type="text">
            </div>
            <div>
                <input type="text">
            </div>
            <div style="position:relative;top:-72;left:250;">
                <input type="text">
            </div>
            <div style="position:relative;top:-72;left:250;">
                <input type="text">
            </div>
        </td>
    </tr>
</table>

Ce code est généré à partir d'une boucle JSP.

A la base, les <div> sont les uns en dessous des autres. Je spécifie les attributs top et left pour déplacer les <div> à l'intérieur de la cellule du tableau.

Le problème c'est qu'il y a un espace blanc sous les 3 <div> de gauche qui correspond certainement à la position initiale des 2 <div> de droite.

Alors évidemment vous allez me dire qu'il suffit de faire plusieurs dcellules dans mon tableau mais je procède d'une autre manière pour pallier à un certain nombre de contraintes dont je ne vais pas m'attarder à expliquer les raisons ici.

J'aimerais juste savoir s'il existe un moins simple, en HTML, de faire disparaitre cet espace blanc.

Merci d'avance

[Bisûnûrs]

Un moyen beaucoup plus simple, oui, pour avoir le rendu souhaité :

Mettre tes div en float:left et leur donner une largeur de la moitié de ta cellule environ.

[danyboy85]

Merci Bisûnûrs mais cela ne résouds pas mon problème. Je fais essayer d'être plus clair.

En fait ma page est un formulaire de saisie qui est généré à partir d'un fichier XML. Un utilisateur crée un fichier XML en spécifiant le nom de la table, le nom des champs, etc...

Ensuite l'utilisateur appelle la page JSP dans son navigateur en passant en paramètre le nom du fichier XML. Cela me permet d'avoir une seule eu unique page qui gère tous les formualires de saisie de l'application.

Dans le fichier XML, l'utilisateur peut également spécifier le positionnement des champs dans le formulaire (avec des coordonnées X et Y, moyen simple et flexible).

Dans ma JSP, Je fais donc une boucle sur chaque champ et je génère pour chacun d'eux un <div> qui contient le libellé et la zone de texte associée.

Ta méthode permet en effet de pouvoir afficher les champs les uns à côté des autres mais ca n'est pas forcément cet affichage que je souhaite dans tous les cas. L'utilisateur peut très bien vouloir afficher 10 champs à gauche, 3 au mileu et 1 en bas à droite. Cela doit être complétement flexible.

Donc ma méthode fonctionne plutôt bien à part cet espace blanc...

[Bisûnûrs]

Alors je ne vois pas de solution à ton cas ... Désolé. :/

[danyboy85]

Incroyable ! Je viens de trouver une solution en regardant un autre post de ce forum qui n'a rien a voire...

Il suffit de rajouter l'attribute "table-layout:fixed" à ma balise <table>
et mettre une hauteur en dur à ma balise <td>. (Hauteur qui peut très bien être spécifiée dans le fichier XML)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<table style="border:1px solid #FF0000;width:500px;table-layout:fixed;" border=1>
    <tr>
        <td id="abcd" style="height:80px">
            <div>
                <input type="text" value="1">
            </div>
            <div>
                <input type="text" value="2">
            </div>
            <div>
                <input type="text" value="3">
            </div>
            <div style="position:relative;top:-72;left:250;">
                <input type="text" value="4">
            </div>
            <div style="position:relative;top:-72;left:250;">
                <input type="text" value="5">
            </div>
        </td>
    </tr>
</table>

Bonne journée !

[Bisûnûrs]

Et ça marche sur Firefox ça ?