merci pour vos réponses, sa m'a bien aidé.

C'est vrai j'avais pas corrigé ça vu que j'étais concentré sur la mise en page. C'est maintenant fait :)

Attention à :
[code]<select name=\"taillebordimage\">[/code]

les [b]\[/b] n'ont pas lieu d'être.

Voici un exemple de code uniquement avec des div et des span.
C'est normalement un code équivalent à ton deuxième tableau. ça paraît long car j'ai indenté le code mais c'est finalement plus simple à lire et il y a moins de code.

[code]<div>
<span class="lignedebut">
Bord Texte:
</span>
<span class="ligne0">
Taille
<select name="taillebordtexte">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</span>
<span class="ligne1" style="margin-left:5px">
Couleur
<input type="hidden" value="" name="colorbinput" id="colorbinput" />
<input id="colorbbox" style="cursor:pointer;width: 20px; height: 20px; border: 1px solid gray;background-color: #000000" onclick="javascript:toggle('b')" />
</span>
<span class="lignedebut" style="margin-left:20px">
Bord Image:
</span>
<span class="ligne0">
Taille
<select name="taillebordimage">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</span>
<span class="ligne1" style="margin-left:5px">
Couleur
<input type="hidden" value="" name="colorcinput" id="colorcinput" />
<input id="colorcbox" style="cursor:pointer;width: 20px; height: 20px; border: 1px solid gray;background-color: #000000" onclick="javascript:toggle('c')" />
</span>
</div>
<div style="border:0px solid #000000;margin-top:15px">
<input type="button" name="retour" value="Retour" onclick="javascript:location.href='image.html';" class="button" onmouseover="this.className='buttonhov'" onmouseout="this.className='button'">
<input type="submit" name="register" value="Enregistrer" class="button" onmouseover="this.className='buttonhov'" onmouseout="this.className='button'">
</div> [/code]

PS J'ai rajouté des margin-left et margin-top ici et là pour aérer un peu

Bonjour, tout d'abord merci pour votre aide sa fonctionne parfaitement.

pour remplacer le div de couleur par une image, il s'agit d'une image transparente auquels j'ajoute la couleur de fond à la balise img?
Quel est l'interêt je vois pas entre div et img?

pour les tr vide effectivement je vais changer sa c'était pour avoir des saut de ligne de 2px.

pour le tableaux, vu que chaque td a une couleur si je change je vais utiliser des div donc le nombre de balise diminuera pas, je comprend pas comment vous alléger mon code en remplaçant le tableaux par des div

merci.

@AB : Oui j'avais compris ;-) Mais auss après ton message, je me suis rendu compte que ma solution est correcte, mais que c'était pas la meilleure. Si on était dans une logique tableau, autant y rester, hehe :)

@HyWaN

Mon Edit était pour dire que nous avons eu la même réaction (sans nous consulter) à la première vue du code :wink:

Oui autant pour moi. Quitte à utiliser des tableaux, autant tout faire en tableau.

Mais si tu peux faire sans tableau, c'est une solution à envisager. Les tableaux sont pratiques, mais lourds dans une page.

Salut,

Ton code n'est pas un modèle académique :wink: Tu devrais t'entrainer à n'utiliser les balises tables tr td que pour des données tabulaires (ou vraiment quand tu ne peux pas faire autrement) et ton code n'en serait que plus lisible et léger.
Cela dit en reprenant ton code voici une solution pour faire ce que tu souhaites
[code]<td class="ligne1" width="80px">
<div id="colorbbox" style="float:right;cursor:pointer;width: 20px; height: 20px; border: 1px solid gray;background-color: #000000" onclick="javascript:toggle('b')">&nbsp;</div>
<div>Couleur:&nbsp;<input type="hidden" value="" name="colorbinput" id="colorbinput" /></div>
</td>[/code]

(n'oublies pas de fixer une largeur suffisante pour td)

Edit : le début de mon message ressemble à celui d'HyWaN. Ce n'est pas une reprise, je ne l'avais pas vu avant de poster car j'étais entrain de vérifier le code que je t'ai proposé :wink:

Tu devrais essayer de mettre les [color=olive]div[/color] en [color=olive]float:left;[/color].

Tu devrais également enlever le tableau, et corriger les erreurs ([color=olive]<select name=[b]\[/b]"tailletexte[b]\[/b]">[/color] par exemple, mais également les cellules vides avec un style). Tu dois sûrement pouvoir remplacer le tableau par une architecture plus simple, et plus légère.

Et peut être mettre une image à la place d'un [color=olive]div[/color]. Ca demande plus de travail sur le moment, mais c'est à mon avis plus accessible et moins problématique pour la suite.

Bonjour, j'ai un problème que je comprend pas, mon code:

[code]<table cellspacing="0" cellpadding="2" style="border:0px solid #000000">
<tr><td style="border:0px solid #000000"></td></tr>
<tr><td class="lignedebut">Texte:</td><td class="ligne1">Taille: <select name=\"tailletexte\">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>

<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select></td><td class="ligne0">Couleur: <input type="hidden" value="" name="colorainput" id="colorainput"><div id="colorabox" style="cursor:pointer;width: 20px; height: 20px; border: 1px solid gray;background-color: #FFFFFF" onclick="javascript:toggle('a')">&nbsp;</div></td><td class="ligne1">Police: testtesttest</td></tr>
</table>
<table cellspacing="0" cellpadding="2" style="border:0px solid #000000">
<tr><td style="border:0px solid #000000"></td></tr>

<tr><td class="lignedebut">Bord Texte:</td><td class="ligne0">Taille: <select name=\"taillebordtexte\">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>

<option value="10">10</option>
</select></td><td class="ligne1">Couleur: <input type="hidden" value="" name="colorbinput" id="colorbinput" /><div id="colorbbox" style="cursor:pointer;width: 20px; height: 20px; border: 1px solid gray;background-color: #000000" onclick="javascript:toggle('b')">&nbsp;</div></td><td class="lignedebut">Bord Image:</td><td class="ligne0">Taille: <select name=\"taillebordimage\">
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>

<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select></td><td class="ligne1">Couleur: <input type="hidden" value="" name="colorcinput" id="colorcinput" /><div id="colorcbox" style="cursor:pointer;width: 20px; height: 20px; border: 1px solid gray;background-color: #000000" onclick="javascript:toggle('c')">&nbsp;</div></td></tr>
<tr><td style="border:0px solid #000000"></td></tr>
<tr><td style="border:0px solid #000000" colspan="6"><input type="button" name="retour" value="Retour" onclick="javascript:location.href='image.html';" class="button" onmouseover="this.className='buttonhov'" onmouseout="this.className='button'">&nbsp;&nbsp;&nbsp;<input type="submit" name="register" value="Enregistrer" class="button" onmouseover="this.className='buttonhov'" onmouseout="this.className='button'"></td></tr>
</table>
[/code]

mes select sont bien à droite de :
mais mes cases div de 20x20 se retrouve dessous "couleur:"
ors je ne spécifie aucun saut de ligne, je comprend pas j'ai essayé tout ce que j'ai pu rien n'y fait.
moi je veux tout sur une ligne

merci d'avance à ceux qui m'aiderons