5568 sujets

Sémantique web et HTML

Bonjour, j'ai un tableau avec dans mes <td>texteRecupéréDeMaBaseDeDonnées</td> mes cases doivent être assez petite sachant qu'il n'y a pas d'espace dans le texte récupéré car ce sont des créneaux horaires (10h30-12h30) par exemple et j'aimerai que la largeur de ma case reste fixe et surtout qu'elle ne s'élargisse pas sinon ça élargit tout mon tableau et donc que ça aille automatiquement à la ligne après le '-' car la case peut contenir que 7 caractères maxi dans la taille de police (déjà petite) choisit. Internet explorer gère ça automatiquement avec les <td style="width:7%"> il va à la ligne sans qu'il y est besoin d'espace et sans plus de précision et l'affichage me va parfaitement mais Firefox ne va pas à la ligne, ne tient pas compte de ma largeur max et élargit mes cases et tout mon tableau avec.

exemple :

<table style="width: 500px;">
     <tr>
          <td style="width:7%;">monTexteSansEspace</td>
          <td style="width:7%;">monTexteSansEspace</td>
          // etc..
     </tr>
     //etc...
</table>


J'aimerai avoir le même affichage sur les 2 navigateurs (celui de IE). Quelqu'un aurait une idée de comment résoudre ce problème ?
Modifié par Biouzor (22 Apr 2009 - 09:02)
Affichage avec IE :

upload/20738-ie.jpg

Affichage avec Firefox :

upload/20738-ff.jpg

(PS: Opera produit le même affichage que firefox, Safari produit le même affichage que IE)
Salut,

Peux-tu donner une url pour qu'on voit ta page en ligne ? En attendant, là comme ça, je te dirais de mettre {table-layout:fixed} sur ton tableau et de dimensionner tes colonnes via des classes HTML et des widths CSS.
Je ne peux le mettre en ligne.
Sinon le table-layout: fixed fonctionne bien et m'a redimensionné comme je voulais mon tableau mais Firefox ne va tout de même pas à la ligne pour afficher les tranches horaires du coup ça s'écrit les uns sur les autres.
Oui, ça me dit quelque chose, je crois me souvenir que Firefox et IE ne sont pas d'accord sur la possibilité de couper un mot après un trait d'union (à vérifier). Tu peux essayer :
- d'insérer une espace avant et après ton trait d'union
- d'utiliser un autre caractère pour séparer tes heures (essaye un &ndash; par exemple)
Justement il n'y a pas d'espace, et mon but est d'obliger firefox à aller à la ligne dans mon <td> après mon '-' qui sépare mes heures. (C'est une donnée qui sera saisie par l'utilisateur, enregistré dans la BDD dans ce format et retranscrit dans le tableau, je ne peux donc pas tout modifier). Ca doit bien être possible ?
a écrit :
enregistré dans la BDD dans ce format et retranscrit dans le tableau, je ne peux donc pas tout modifier
As-tu essayé, lors de la récupération des horaires dans la base, de simplement remplacer, en PHP/ASP/autre, le trait d'union par un &ndash; (par exemple) ?
Le '-' est saisi par l'utilisateur, il peut mettre le caractère de séparation de son choix, mais il a seulement 11 caractères pour saisir le créneau entier donc on ne peut mettre '&ndash'.
Modérateur
Bonjour Biouzor,

L'idée est de modifier le texte lors de l'affichage uniquement, et non directement dans la base de données. Avec une expression régulière (regex), tu pourrais très bien modifier à la volée le séparateur (quel qu'il soit) entre les heures, et ce, lorsque tu génères le code HTML avec la technologie de ton choix (PHP, Coldfusion, ASP, etc...).
Modifié par Tony Monast (21 Apr 2009 - 17:31)
Problème résolu merci, je récapitule donc :

Pour fixer la taille de mes colonnes sur tout navigateur en plus de la propriété CSS "width:XXpx;" :


table-layout:fixed


Et pour obliger le passage à la ligne dans ma case sur tout navigateur après un caractère non alphanumérique (tout en affichant mon '-' Smiley langue ) :


<?php echo eregi_replace("[^A-Z0-9\ ]", "-<br/>",$maChaine); ?>


Merci pour les conseils
Modifié par Biouzor (22 Apr 2009 - 09:01)
Salut,
Biouzor a écrit :

<?php echo eregi_replace("[^A-Z0-9\ ]", "-<br/>",$maChaine); ?>

De manière générale, quand tu utilises les regex en PHP, sers-toi plutôt des fonctions preg_* qui sont des fonctions PCRE à la place des fonctions ereg* qui sont des fonctions POSIX et sont bien moins rapides.

Ce qui donnerait :

<?php
echo preg_replace( '#[^A-Z0-9\ ]#i', '-<br />', $maChaine );
?>