Tracer une ligne valide w3c

dohm Messages postés 983 Date d'inscription   Statut Modérateur Dernière intervention   -  
Ssylvainsab Messages postés 2892 Statut Modérateur -
Bonjour,

je cherche à tracer une ligne verticale et des lignes horizontales qui soient valide en W3C et j'avoue que je n'y arrive pas !

voila la page dans son état actuel :
http://www.sports-vacances-formation.com/

mon problème est de remplacer les lignes encadrant la table des matières par un équivalent w3c ....

qui a une p'tite idée ?
merci d'avance.
--
Dohm
Big cousin is watching you !
Configuration: Windows XP
Firefox 2.0.0.1

9 réponses

  1. Ssylvainsab Messages postés 2892 Statut Modérateur 825
     
    Bonsoir.

    Pour les lignes horizontales, tu peux utiliser la balise hr.

    Pour les lignes verticales, tu peux utiliser des bordures.

    Il me semble que tu utilises déjà des bordures, c'est la meilleure facon je pense.
    Est-ce que tu es sur que ce sont les bordures qui rendent ton code invalide ?
    Je ne pense pas, car elles sont insérées avec CSS.
    1
    1. dohm Messages postés 983 Date d'inscription   Statut Modérateur Dernière intervention   67
       
      le problème des bordures, c'est que je n'arrive pas à en mettre qu'une en haut par exemple, je suis obligé d'entourer mes cellules de 4 bordures et ce n'est pas ce que je veux.

      pour le moment, je triche en forçant la largeur de mes cellules (ce qui n'est pas apprécié par le w3c). je fais des cellules d'1px replies de la couleur de la bordure que je veux obtenir.

      quand aux lignes <hr>, je n'arrive pas à les positionner correctement en bas de ma cellule.
      0
  2. Ssylvainsab Messages postés 2892 Statut Modérateur 825
     
    Tu peux facilement définir des bordures seulement en haut, en bas, à gauche ou a droite ;-)

    Haut: border-top
    Bas: border-bottom
    Gauche: border-left
    Droite: border-right

    Après, utilises les valeurs normalement, comme avec border tout court ;-)

    Par exemple :
    border-top:1px solid blue;
    border-left:2px dotted red;
    0
  3. dohm Messages postés 983 Date d'inscription   Statut Modérateur Dernière intervention   67
     
    vi,

    ça c'est la théorie mais j'ai pas réussi à le faire marcher ... T'as un exemple qui marche ?
    0
  4. Ssylvainsab Messages postés 2892 Statut Modérateur 825
     
    Une bête page html :
    (mais non valide ici)
    <html>
    <head>
      <style type="text/css">
         div{
            border-top:1px dotted red;
            border-left:4px dashed green;
            border-bottom:1em solid brown;
            border-right:2px dashed black;}
       </style>
    </head>
    <body>
      <div>Admirez les bordures</div>
    </body>
    </html>

    Ca donne ca :
    http://ssylvainsab.free.fr/CCM/bordures.html
    0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. Gihef Messages postés 5165 Statut Contributeur 2 781
     
    Bonjour,

    Un exemple qui marche (?) et qui te parlera peut-être un peu plus car basé sur ta page.

    Ton souhait de conformité m'a fait ajouter un menu construit par une liste.
    Ça ajoute des contraintes et ajustements, mais c'est plus conforme.

    + Les styles sont dans la page.
    0
  7. Ssylvainsab Messages postés 2892 Statut Modérateur 825
     
    salut Gihef :)

    J'ai testé ton exemple sous IE 6.0 sous Windows et pas de problèmes majeurs d'affichage.

    La seule chose que j'avais remarqué avec IE à propos des bordures est qu'il affiche mal les bordures en pointillés et tirets, nottamment au scroll.

    Mais pourquoi est-ce que tu ne peux pas tester tes pages sous IE ?
    Tu as Linux ?

    a plus
    0
    1. Gihef Messages postés 5165 Statut Contributeur 2 781
       
      Salut Ssylvainsab (-:

      Non, mais j'aimerais bien.
      Ce que mon profil n'indique pas c'est que le seul IE dont je dispose est la version 5.2.3 ©1995-2001
      Le problème est qu'il ne sera plus mis à jour et qu'il fonctionne mieux que la version 6 sur PC-IBM… !

      Merci pour le test.
      0
  8. dohm Messages postés 983 Date d'inscription   Statut Modérateur Dernière intervention   67
     
    zalez me prendre pour le relou que je suis mais j'arrive pas à appliquer ça sur une seule cellule et non pas sur tout le tableau ...

    alors à moins de créer des tableaux bidons ... je ne vois pas comment faire.
    0
  9. Ssylvainsab Messages postés 2892 Statut Modérateur 825
     
    Salut dohm.

    J'imagine que tu as essayé ca :
    table{border:1px solid black}
    (ou quelque chose dans le genre)

    Sachant que les cellules d'un tableau sont les balises td ou th, utilises :
    td,th{border:ton style...}
    0
    1. dohm Messages postés 983 Date d'inscription   Statut Modérateur Dernière intervention   67
       
      là, où ça devient sioux, c'est que je ne veux pas que chaque cellule ait le même comportement ... et je n'arrive pas à appliquer des styles différents .
      0
  10. Ssylvainsab Messages postés 2892 Statut Modérateur 825
     
    A ce moment là, utilises des class et des id pour tes cellules.
    Ce sont des attributs qui te permettent d'accéder a un ou plusieurs éléments en CSS.

    Si tu utilises :
    <td class="truc">
    dans le code html, le code CSS sera :
    .truc{...}

    Avec l'attribut id, c'est un dièze :
    #truc{...}

    Un id ne doit être utilisé qu'une seule fois dans une page, alors qu'on peut utiliser plusieurs fois une classe.
    0