- Statut : non résolu
- Ce sujet contient 12 réponses, 3 participants et a été mis à jour pour la dernière fois par Guy, le il y a 13 années et 7 mois.
-
AuteurMessages
-
2 mai 2011 à 10 h 04 min #494500
Ma configuration WP actuelle
– Version de WordPress : 3.1.1
– Version de PHP/MySQL : il me semble que c’est la plus récente
– Thème utilisé : Twenty Ten 1.2 quelque peu modifié
– Extensions en place : aucune liée au soucis
– Nom de l’hebergeur : OVH
– Adresse du site : en cours de développement ^^Problème(s) rencontré(s) :
Bonjour à tous !
Je suis actuellement en stage et j’utilise WordPress en tant que CMS sans blog.
J’ai un site à faire qui contient pas mal de formulaires, je les ai tous faits à la main et j’ai quelques soucis d’affichage ! Regardez par vous même :
Sous IE :
Sous Chrome :
Je n’ai pas testé sous d’autres navigateurs.Le but étant que l’affichage se fasse comme sur Chrome.
J’ai beau essayer toutes les propriété CSS que je connais et qui pourraient y changer quelque chose, mais je n’y parviens pas. J’ai également cherché sur google et le forum, sans résultat.
Je tiens à préciser également que le formulaire est agencé sous forme de tableau, car avec des propriétés CSS ça ne fonctionnait pas, comme si les input et autres select ne prenaient pas en compte le CSS.
Les propriétés CSS sont d’ailleurs dans le contenu de ma page juste au-dessus du formulaire (dans le code).
De plus, si je teste le formulaire en brut sous IE, c’est-à-dire dans une page PHP sans l’intermédiaire de WP, le formulaire est correctement affiché !Donc je ne comprends pas comment je peux arriver à modifier l’affichage sous IE (et peut-être d’autres navigateurs).
Est-ce que quelqu’un a une idée sur la question ?
Je vous remercie par avance !
2 mai 2011 à 10 h 37 min #767723sans un apercu du code, les réponses risquent de passer à coté du problème
2 mai 2011 à 10 h 41 min #767724Ah oui d’accord !
Alors je ne reprends que le formulaire, s’il y a besoin d’autre chose je peux toujours l’ajouter !<fieldset>
<legend>Identité</legend>
<table>
<tr>
<td class="premiere_col">
Nom :
</td>
<td>
<input type="text" name="nom" size='20' maxlength="32" value=" » />
</td>
</tr>
<tr>
<td>
Prénom :
</td>
<td>
<input type="text" name="prenom" size='20' maxlength="32" value=" » />
</td>
</tr>
<tr>
<td>
E-mail :
</td>
<td>
<input type="text" name="email" size='20' maxlength="32" value=" » />
</td>
</tr>
<tr>
<td>
Login :
</td>
<td>
<input type="text" name="login" size='20' maxlength="32" value=" » />
</td>
</tr>
<tr>
<td>
Mot de passe :
</td>
<td>
</td>
</tr>
<tr>
<td>
Confirmer mot de passe :
</td>
<td>
</td>
</tr>
</table>
</fieldset>J’espère que c’est assez lisible !
2 mai 2011 à 12 h 37 min #767725Il n’y a rien de spécial ni de compliqué la dedans.
Une des façons pour obtenir le resultat que tu as sous IE, c’est que la hauteur des cellules de la colonne 1 soit définie quelque part à une valeur supérieure à la hauteur des input et avec un alignement vertical sur bottom, alors que dans la colonne 2 l’alignement vertical serait défini sur top. Là, c’est dans les css qu’il faudra regarder.
Sur Mozilla, il y a une extension qui te permet de voir les styles d’un élement particulier, cela peut donner une indication si il n’y a pas de styles conditionels pour IE et Mozilla dans les sources. C’est Web Developper.
2 mai 2011 à 13 h 35 min #767726Alors j’ai trouvé la ligne là dans le CSS :
.entry-content input {
margin: 0 0 24px 0;
}J’ai mis à 15 le 24 pour tester, toutes les lignes du tableau se sont rapprochées après modification.
Finalement, j’ai rajouté dans le code :
td{
vertical-align: top;
}et du coup tout est bon maintenant, même sous IE.
Donc voilà pour le moment ce soucis a l’air réglé, il faut que je fasse de même avec les label pour les checkbox et boutons radio !Je te remercie Guy pour tes conseils, ils m’ont aidé à trouver la solution ! 👏
✅Edit : je ne peux pas modifier le titre du topic et y ajouter la mention [Résolu]
2 mai 2011 à 17 h 00 min #767727ben voila 🙂 mais c’est toi qui a trouvé quand même.
Pour ne pas risquer de désorganiser tout le thème, il serait bien de définir une classe pour ces tableaux et d’appliquer les styles pour les colonnes etc… uniquement dans cette classe. En faisant comme tu le fais, tous les tableaux seront alignés en haut et tous les input de entry-content auront une hauteur moins grande.
2 mai 2011 à 17 h 09 min #767728il serrais plus simple de dégager les tableau qui sont totalement obsolète au profit de DIV et utilisation de LABEL.
3 mai 2011 à 7 h 15 min #767729oui 🙂, mais bon…
D’apres ce que j’ai compris, il y a beaucoup de formulaires, l’essai des div avait été fait et il y avait un problème d’interprétation des feuilles de styles. Cela demanderait une revue du code et possiblement beaucoup de travail pour un résultat visuel que l’on peut espérer identique.3 mai 2011 à 7 h 22 min #767722Oui voilà, exactement !
J’ai passé plusieurs heures à essayer sans tableaux avec des div et CSS, mais les input et autres balises des formulaires ne se comportaient pas correctement dans l’environnement WP, or avec les tableaux ça fonctionne nickel !
Je vais définir des classes comme tu dis Guy, ça m’évitera d’avoir à revenir sur cette partie du CSS plus tard si j’ai un soucis ^^3 mai 2011 à 8 h 18 min #767730oui c’est une façon de voir les choses mais c’est handicapant à la longue de rester sur des standards obsolète.
3 mai 2011 à 8 h 59 min #767731Guy : C’est pas un peu dangereux Web Developer ? J’ai fait des tests en changeant les select en input text par exemple, et n’importe qui peut saisir n’importe quelle valeur et ça peut foutre en l’air la Base de Données !
Ca fait peur, je n’avais pas prévu ça 😮anthony_synapse : je sais que ce n’est pas conseillé, mais je n’ai malheureusement pas le temps de tout revoir mes formulaires alors que ça fonctionne ainsi 😕
3 mai 2011 à 9 h 20 min #767732tu prêches un convaincu, les tables ne sont pas forcement obsolètes mais devraient être utilisées pour ce à quoi elle sont destinées, des données tabulaires. Néanmoins, il faut avouer que certaines fois une présentation avec un tableau est une solution plus intuitive et plus rapide.
Pour un site pro avec un contenu fourni et une maintenance qui tient la route, la question ne se pose (presque) pas, pour un projet plus léger, le temps de chargement des pages avec tables, la « sémantique » peuvent prendre moins d’importance.
Pour reprendre un argument maintes fois lu, je préfere consulter un site « mal » construit avec des tables et bien structuré visuellement, qu’un site respectant des standards mais partant dans tous les sens. Ce qui, je te l’accorde n’est pas un argument 🙂3 mai 2011 à 9 h 47 min #767733Web Developper est exactement fait pour cela 🙂, enfin en partie. il fait partie des outils d’analyse de sécurité mais permettra aussi des tests dans des environnements spécifiques (javascript désactivé, etc…), plus des options pour inspecter la page, un bon outils.
-
AuteurMessages
- Le forum ‘Utilisation spécifique de WordPress’ est fermé à de nouveaux sujets et réponses.