Partage
  • Partager sur Facebook
  • Partager sur Twitter

texte droit ne veut pas se mettre sur balise p(2em

Sujet résolu
    13 août 2017 à 0:21:20

    bonjours

    https://fiddle.jshell.net/h2zz26t7/1/

    j'aimerais tout les 

    <p>par <span>tester</span> le <time datetime="2012-02">février 2012</time></p>


    seront texte droite

    j'ai tester :last-child ou > p  etc..

    tout les codes que je connais lol 

    a mois que je ne connais pas un autre code

    mais par contre si je remplace la balise p par div 

    et en css

    	  #global-reponse div
    	  {
    	  text-align:right;
    	  padding:1em;
    	  margin:0;
    	  border-bottom:#CCCCCC 1px solid;
    	  border-left:#CCCCCC 1px solid;
    	  border-right:#CCCCCC 1px solid;
    	  }
    

    là ca marche 

    mais sur un site dit qu'il faut mettre une balise p https://www.alsacreations.com/article/lire/1386-html5-element-time.html

    mais si vous me dites de metre un div car pas trop le choix pas soucy ;)

    merci

    • Partager sur Facebook
    • Partager sur Twitter
      13 août 2017 à 11:54:15

      Salut utilise une class.

      <p class="right">par <span>tester</span> le
          <time datetime="2012-02">février 2012</time>
      </p>
      .right {
        text-align: right;
      }




      • Partager sur Facebook
      • Partager sur Twitter
      My Website - 
        13 août 2017 à 12:08:29

        Hello,

        Alors rien à voir avec ta demande, mais je cite :

        Vous pouvez ne pas le faire, mais l’administrateur du forum peut avoir configuré les forums afin qu’il soit nécessaire de s’enregistrer pour poster des messages. Par ailleurs, l’enregistrement vous permet de bénéficier de fonctionnalités supplémentaires inaccessibles aux invités comme les avatars personnalisés, la messagerie privée, l’envoi d’e-mails aux autres membres, l’adhésion à des groupes, etc. La création d’un compte est rapide et vivement conseillée.

        Un conseil ne prends pas tes utilisateurs pour des enfants, depuis tout le monde connait l'intérêt de créer un compte ^^ . Mets juste en avant les fonctionnalités, ça devrait suffire...

        • Partager sur Facebook
        • Partager sur Twitter
          13 août 2017 à 18:12:15

          HadockB a écrit:

          Salut utilise une class.

          <p class="right">par <span>tester</span> le
              <time datetime="2012-02">février 2012</time>
          </p>
          .right {
            text-align: right;
          }


          merci, j'avais pensais , mais c'était juste pour evité une class ;)

          mais par contre j'ai remarqué si je met h3 dans la balise p

          <p class="auteur-faq"><h3>tittre</h3>par <span>tester</span> le <time datetime="2012-02">février 2012</time></p>

          il y a une ereur w3c 

          No p element in scope but a p end tag seen.
          From line 197, column 125; to line 197, column 128
          012</time></p>↩

          dans ce cas il faut metre un div si je met une balise h3 

          et si je ne met pas h3 là je peut mettre une balise p

          si c'est bien ça 

          merci



          • Partager sur Facebook
          • Partager sur Twitter
            13 août 2017 à 18:38:12

            Faut que tu apprenne à bien utiliser html :magicien: 

            C'est interdit de mettre des ballises de texte (h2, p, h3, ect..) dans d'autre balise du même type; donc l'erreur est normale.

            Le fait d'utiliser une class est, il me semblent, la solution la plus "pro-pre" :p Si tu veux absolument mettre une div alors le schéma est simple (mais l'utilisation d'une class fortement conseiller tout de même) :

            <div>
                <p>Titre par <span>Dupont</span> le <time>11/11/11</time>.</p>
            </div>



            • Partager sur Facebook
            • Partager sur Twitter
            My Website - 
              13 août 2017 à 23:21:44

              Bonjour,

              pourquoi veux-tu éviter des classes ? C'est pas sale, hein. Tu es plein de bonne volonté et tu prends visiblement plaisir à écrire, réécrire et peaufiner ton projet : accepte qu'on te fasse des critiques constructives et qu'on te suggère de changer tes paradigmes.

              Et surtout… l'article que tu mets en lien ne dit pas "mettez <time> dans <p> et pas autre part !". Ce sont des exemples d'utilisation. Dans la spec ( https://www.w3.org/TR/html/textlevel-semantics.html#the-time-element ), il est dit qu'on peut mettre <time> dans tout élément qui accepte du phrasing context. Autrement dit : la quasi-totalité des éléments.

              • Partager sur Facebook
              • Partager sur Twitter

              Pas d'aide concernant le code par MP, le forum est là pour ça :)

                14 août 2017 à 1:36:05

                HadockB a écrit:

                Faut que tu apprenne à bien utiliser html :magicien: 

                C'est interdit de mettre des ballises de texte (h2, p, h3, ect..) dans d'autre balise du même type; donc l'erreur est normale.

                Le fait d'utiliser une class est, il me semblent, la solution la plus "pro-pre" :p Si tu veux absolument mettre une div alors le schéma est simple (mais l'utilisation d'une class fortement conseiller tout de même) :

                <div>
                    <p>Titre par <span>Dupont</span> le <time>11/11/11</time>.</p>
                </div>

                je veux bien mettre des class autant que tu veux ;)

                je vous mets 3 exemple que j'ai mis dans les pages et vous me direz si c'est bon où pas et par quoi modifier

                	  <article>
                	  <!--début de la 1 er news-->
                	  <h2>titre de la news</h2>
                	  <p>publié par <span>pseudo</span> le <time>10:30</time></p>
                	  <p>ma news</p>
                	  <nav><ul><li>vues : 4910</li><li>commentaires : 8</li><li>écrire un commentaire</li><li>forum : mises à jour</li></ul></nav>
                	  <!--fin de la 1 éme news-->
                	  </article>
                

                pour ce code je penses c'est bon ;)

                ensuite 

                 <div class="global-forum-index">
                                    <div class="forum-index">icon</div>
                   <h3 class="forum-index">hardware</h3>
                   <span class="forum-index">4 000</span>
                  <div class="forum-index"></div>
                  <div class="forum-index"><h3>titre du topic</h3><time>10:30</time></div>
                 </div>
                


                pour info 

                la ligne 2 c'est un rond avec un icon ;))

                ligne 3 c'est le titre

                ligne 4 c'est le nombre de page ou ceux que tu veux

                ligne 5 c'est un rond avec icon ou image d'avatar

                ligne 6 titre du topic date pseudo 

                ensuite j'ai ça

                <div class="global-forum-topic">
                    <div class="forum-topic"></div>
                   <div class="forum-topic"></div>
                 <h3 class="forum-topic">titre du topic</h3>
                 <span class="forum-topic">4 000</span>
                <div class="forum-topic"></div>
                 <div class="forum-topic"><time>10:30</time> par pseudo</div>
                </div>
                

                pour info 

                la ligne 2 et 3 c'est un rond avec un icon ;))

                ligne 4 c'est le titre

                ligne 5 c'est le nombre de page ou ceux que tu veux

                ligne 6 c'est un rond avec icon ou image d'avatar

                ligne 7 titre du topic date pseudo 

                pour info on m'a dit pour faire un caré ou un rond c'est un div (ok)

                maintenant pour englober le titre et span et le time il faut que je modifier le div par p 

                voilà la corection

                <div class="global-forum-index">
                	 <div class="forum-index">icon</div>
                	<h3 class="forum-index">hardware</h3>
                	  <span class="forum-index">4 000</span>
                	 <div class="forum-index"></div>
                	<p class="forum-index">titre du topic <time>10:30</time></p>
                 </div>


                et

                <div class="global-forum-topic">
                		       <div class="forum-topic"></div>
                		     <div class="forum-topic"></div>
                		  <h3 class="forum-topic">titre du topic</h3>
                		<span class="forum-topic">4 000</span>
                		  <div class="forum-topic"></div>
                		<p class="forum-topic"><time>10:30</time> par <span>pseudo</span></p>
                								 </div>


                si c'est bien come celà je remodifierais 

                lol

                • Partager sur Facebook
                • Partager sur Twitter
                  14 août 2017 à 9:44:25

                  Salut, alors /*boit mon café*/ ;

                  Pour un carré tu peux effectivement utiliser une div :

                  • tu crée ta div avec une class "carre" par exemple
                  • tu la transforme en carré avec une height et width de la même taille par exemple 50px

                  Pour le cercle il suffit de rajouter dessus un border-radius (ça a pour effet d'arrondir les coin :) ) donc si tu les règle à 50%; pouf :magicien: tu as un rond! (https://jsfiddle.net/HadockB/em7bLns7/)

                  .green {
                  	background-color:green;
                  }
                  
                  .carre {
                  	height:50px;
                  	width:50px;
                  }
                  
                  .circle {
                  	height:50px;
                  	width:50px;
                  	border-radius:50%;
                  }
                  <div class="carre green">
                  </div>
                  
                  <div class="circle green">
                  </div>


                  Ensuite tu utilise :

                  <div class="global-forum-topic">
                  
                    <div class="forum-topic"></div>
                    <div class="forum-topic"></div>
                  
                    <h3 class="forum-topic">titre du topic</h3>
                    <span class="forum-topic">4 000</span>
                  
                    <div class="forum-topic"></div>
                  
                    <p class="forum-topic">
                      <time>10:30</time> par <span>pseudo</span>
                    </p>
                  
                  </div>

                  Span sert surtout à associer un style à une partie d'un texte tandis que div sert à agencer le contenu de la page. Du coup tu devrait remplacer ton premier span par un p du genre :

                  <h3 class="forum-topic">titre du topic</h3>
                  <p class="forum-topic">4 000</p>


                  Ensuite à quoi correspond en css les class que tu as mis? 



                  -
                  Edité par HadockB 14 août 2017 à 9:45:34

                  • Partager sur Facebook
                  • Partager sur Twitter
                  My Website - 
                    14 août 2017 à 23:23:45

                    je t'ai fait une page vite fait

                    https://fiddle.jshell.net/120a7zv6/

                    je penses que c'est bon ;)

                    si on doit rajouté dans le rond sur le child 4 un petit rond ou un petit carré

                    j'ai pensais


                    <div class="forum-topic"><div>petit rond</div></div>


                    et je met les balise div autent de fois que je veux

                    si je met juste un petit rond je met

                    <div class="forum-topic"><div>petit rond</div></div>

                    si je rajoute un petit caré

                    <div class="forum-topic"><div>petit rond</div><div>petit carre</div></div>


                    si je rajoute un rectangle

                    <div class="forum-topic"><div>petit rond</div><div>petit carre</div><div>grand rectangle</div></div>


                    je met le css

                    forum topic c'est position relatif

                    avec le css qui seront à l'interrieur du carée ou un rond


                    /*******petit carré en haut a gauche*****/
                          .forum-topic div:nth-child(1)
                    	  {
                    	  position:absolute;
                    	  top:0;
                    	  left:0;
                    	  padding:0.5em;
                    	  border-right:#CCCCCC 1px solid;
                    	  border-bottom:#CCCCCC 1px solid;
                    	  }
                    
                    /*******petit ronden haut a droite*****/
                         .forum-topic div:nth-child(2)
                    	  {
                    	  position:absolute;
                    	  top:1em;
                    	  right:1em;
                    	  border-radius:50%;
                    	  border:#CCCCCC 1px solid;
                    	  padding:0.5em;
                    	  }
                    /*******rectangle en bas****/
                    
                          .forum-topic div:nth-child(3)
                    	  {
                    	  position:absolute;
                    	  bottom:0;
                    	  width:100%;
                    	  border-top:#CCCCCC 1px solid;
                    	  padding:0.5em;
                    	  text-align:center;
                    	  }
                    

                    je ne sais pas si c'est la bone méthode mais ça marche ;)


                    bien entendu je t'ai doné vitte fait un exemple ;)

                    sinon je peut aussi mettre une nouvele class (si c'est plus propre afin de metre des rond et carré à l'interrieur d'un grand carré u un grand rond 

                    <div class="forum-topic carre"><div></div><div></div></div>

                    en css je prend carre avec le css carre chil1 et carre child 2 etccc

                    tu me dirras 

                    merci 

                    • Partager sur Facebook
                    • Partager sur Twitter
                      15 août 2017 à 0:16:40

                      Ça semblent correcte, par contre je te conseil de changer tes class.

                      Chaque class doit porter un nom en rapport avec sont "rôle". Mettre partout une class "forum-topic" c'est pas lisible ^^  

                      Je te conseil un truc du genre :

                      • carreSmall pour les petit carrés
                      • rondSmall pour les petit ronds
                      • rectangle pour les rectangles 
                      • ect, ..... 

                      Par exemple :

                      <!--début de la 1 er ligne-->
                      <div class="globalAnnonce">
                        <!--j'afficherais un rond avec un petit icon ou image  -->
                        <div class="roundedImageSmall"></div>
                        <!--j'afficherais un petit icon -->
                        <div class="icon"></div>
                        <!--j'afficherais le titre -->
                        <h3 class="title">titre du topic</h3>
                        <!--j'afficherais le nombre de vue ou réponse -->
                        <span class="view">4 000</span>
                        <!--j'afficherais un moyen rond avec une icon ou image d'un membre -->
                        <div class="roundedImageLarge"></div>
                        <!--j'afficherais le titre date et pseudo -->
                        <p class="info"><a href="#" title="titre du topic">titre du topicc</a>
                          <time>10:30</time> par <span>pseudo</span></p>
                      </div>

                      Tu peux imbriquer autant de div que tu veux pas de soucie pour ça.

                      • Partager sur Facebook
                      • Partager sur Twitter
                      My Website - 
                        15 août 2017 à 10:47:55

                        ok je changerais les nom des class 

                        je penses que c'est pour eviter de mettre en css child 1 child 2 etc..

                        à mon avis ;)

                        je met en résolu et quand j'aurais finit les pages si ton cœur te le dit je envoi les pages par mp pour que tu puisses vérifier si tout est bon (si tu veux bien) ;)

                        merci

                        • Partager sur Facebook
                        • Partager sur Twitter
                          15 août 2017 à 11:16:08

                          En faite il faut surtout voir ça comme un code que tu n'écrit pas pour toi :D Du coup moi j'arrive je regarde ton code html les class sont toute les même, je comprend pas trop [...] je regarde ton css, arf faut que je calcule quel enfant est pris en compte, ect...

                          Alors que si ta class porte un nom "qui veux dire quelque chose" genre (postImg, postTitre, ect..) on cerne mieux l'ensemble sans forcément lire le css =)

                          -
                          Edité par HadockB 15 août 2017 à 11:17:49

                          • Partager sur Facebook
                          • Partager sur Twitter
                          My Website - 
                            16 août 2017 à 1:37:09

                            ok pas de souci ;)

                            si moi je comprend c'est le principal ;)

                            on vas mettre différent de nom come ça tout le monde sera heureux ;) mdr 

                            a bientot 

                            je t'enverais un mp pour te montrer t tu me diras si c'est bien 

                            sujet résolu 

                            • Partager sur Facebook
                            • Partager sur Twitter
                              16 août 2017 à 11:16:42

                              will.smith a écrit:

                              si moi je comprend c'est le principal ;)



                              Oui mais tu verra par la suite que c'est important que les autre puisse aussi comprendre ;)

                              • Partager sur Facebook
                              • Partager sur Twitter
                              My Website - 

                              texte droit ne veut pas se mettre sur balise p(2em

                              × 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