Partage
  • Partager sur Facebook
  • Partager sur Twitter

[CSS] Comportement étrange.

class et id

Sujet résolu
    27 novembre 2005 à 14:04:04

    Salut tout le monde ;)

    J'ai un petit problème, que j'ai réussi à contourner mais qui relève plus de la curiosité maintenant..

    J'ai donc en html :


    <html>
    <head>...</head>

    <body>
    ....
    <div id="corps">
    ...
    <div id="news">...<p class="date">17/09/90</p>...</div>
    ...
    </div></body></html>



    Et en css :


    ....
    #corps p {
    font-size: font-size: 0.8em;
    text-align: justify;
    }
    ....
    div#news p.date {
    text-align: center;
    }
    ....


    Mon paragraphe "date" est bien en italique mais pas centré. J'imagine que cela vient du "justify".
    Après plusieurs tests, quand je remplace le class par un id, c'est centré (solution qui ne m'intéresse pas puisque c'est dans une boucle PHP).
    Par contre quand je rajoute [style="text-align: center;"] dans la balise p. Cela est centré..

    Apparemment, ca fait pareil sur tous les browsers..

    De quoi ca vient ?

    Merci.
    • Partager sur Facebook
    • Partager sur Twitter
      27 novembre 2005 à 14:20:38

      Essaye ceci :

      #corps{
      font-size: 0.8em;
      text-align: justify;
      }
      p{
      font-size: 0.8em;
      text-align: justify;
      }
      div#news{
      text-align: center;
      }
      p.date{
      text-align: center;
      }
      • Partager sur Facebook
      • Partager sur Twitter
        27 novembre 2005 à 14:40:27

        Je viens d'essayer, ca ne marche pas..

        Ca a simplement pour effet de centrer tout le corps de la page et tous le contenu de la div#news (logique d'ailleurs..)

        Merci quand même ;)
        • Partager sur Facebook
        • Partager sur Twitter
        Anonyme
          27 novembre 2005 à 14:56:22

          Pake tu t'es trompé dans ton code man ;) il faut que tu mette AVANT ton id ou ta classe et après le nom de ta balise :


          #corps{
          font-size: 0.8em;
          text-align: justify;
          }
          p{
          font-size: 0.8em;
          text-align: justify;
          }
          #news div{
          text-align: center;
          }
          .date p{
          text-align: center;
          }


          Euh, et sépare ton id et ta class, fais deux propriétés séparées !
          • Partager sur Facebook
          • Partager sur Twitter
            27 novembre 2005 à 15:05:19

            Mettons les choses au clair :

            p.xxx = Les <p> ayant la classe "xxx"
            .xxx p = Les <p> contenus dans un bloc de classe "xxx"
            • Partager sur Facebook
            • Partager sur Twitter
              27 novembre 2005 à 15:06:58

              Citation : ApOpH!s

              Mettons les choses au clair :

              p.xxx = Les <p> ayant la classe "xxx"
              .xxx p = Les <p> contenus dans un bloc de classe "xxx"



              C'est ce que j'ai fait non ?

              Edit : Mais si je dit que tous les paragraphes de ma div #corps doivent être justifiés, et que plus loins, je dit que l'un d'entre eux doit etre centré, ca pose forcément problème ??

              D'ailleurs ca me fait pareil pour font-size..
              • Partager sur Facebook
              • Partager sur Twitter
                28 novembre 2005 à 19:02:21

                J'ai le droit à un UP ?
                • Partager sur Facebook
                • Partager sur Twitter
                  28 novembre 2005 à 19:10:25

                  Tu ne peu centrer avec la propriété "text-align" que des éléments de type "inline"! Pour les blocs il te faut autre chose!
                  • Partager sur Facebook
                  • Partager sur Twitter
                    28 novembre 2005 à 19:13:03

                    Et pour centrer du texte à l'intérieur d'un block ??

                    Le <p> prend toute la largeur non ?
                    Donc le texte présent à l'intérieur devrait être centré non ?

                    Pour la taille du texte, c'est pareil ?

                    Merci ;)
                    • Partager sur Facebook
                    • Partager sur Twitter
                      28 novembre 2005 à 19:53:26

                      J'ai testé avec ton code xHTML :


                      #corps p {
                      font-size: font-size: 0.8em;
                      text-align: justify;}
                      #news p.date {
                      text-align: center;}


                      Chez moi ça marche. J'espère que ça t'aidera.
                      • Partager sur Facebook
                      • Partager sur Twitter
                        28 novembre 2005 à 20:14:24

                        Hmmmm... Ca ne marche pas... Merci quand même..

                        Bizzare tout ca..

                        PS : Cela peut changer quelquechose si "news" est une classe ou un id ?
                        • Partager sur Facebook
                        • Partager sur Twitter
                          28 novembre 2005 à 20:29:47

                          Ton erreur doit venir d'autre part ou peut-être de la déclaration du doctype (j'avais eu un problème de ce type à cause d'un mauvais doctype), je t'envoie le code complet sur que j'ai testé :

                          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
                          <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

                          <head>
                          <title>titre</title>
                          <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

                          <style>
                          #corps p {
                          font-size: font-size: 0.8em;
                          text-align: justify;}

                          #news p.date {
                          text-align: center;}
                          </style>

                          </head>
                          <body>
                          <div id="corps">
                                  Texte justifié : Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                                  <div id="news">
                                          <p class="date">
                                          Texte centré
                                          </p>
                                  </div>
                          </div>
                          </body>
                          </html>
                          • Partager sur Facebook
                          • Partager sur Twitter
                            30 novembre 2005 à 15:06:51

                            Merci bien ton code m'a aidé : je me suis rendu compte qu'en remplacement le #news par .news (et le id="news" par class="news") ca ne marchait plus..

                            C'est assez étrange, mais je pense que je ne peux rien y faire..

                            Edit : En remplacant : "#corps p" par "p", ca marche.. Ca me permet de pas changer grand chose et d'avoir un truc qui marche. Merci beaucoup :p
                            Edit2 : Ca marche aussi en remplacent "div.news p.date" par "#corps div.news p.date"
                            • Partager sur Facebook
                            • Partager sur Twitter
                            Anonyme
                              30 novembre 2005 à 15:44:07

                              euh, dans un ID tu peux faire #tonid tabalise
                              mais il est conseillé d'utiliser une classe pour être sur que ça fontcionne !!!
                              • Partager sur Facebook
                              • Partager sur Twitter
                                30 novembre 2005 à 22:29:33

                                salut
                                j'utilise notepad++ et quand je mais les attributs "class" ou "id", ceux-la ne prennent pas la couleur verte comme les autres mais reste violet
                                ainsi dans l'explorateur, si je met par exemple (<p class="cache" >hhhasssa...</p>)dans mon html et bien je ne vois que ce <p> et le css n'est pas respecter
                                mon probleme concernant les "class" et "id" je ne voulais pas ouvrir un autre post juste pour ça
                                merci :p
                                • Partager sur Facebook
                                • Partager sur Twitter

                                [CSS] Comportement étrange.

                                × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                                × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                                • Editeur
                                • Markdown