Partage

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

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;
}




Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode
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...

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



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>



Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode
Staff 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.

Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!
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

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

Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode
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 

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.

Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode
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

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

Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode
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 

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 ;)

Je vous parraine sur Star Citizen (et vous gagnez 5000uec) >>STAR-VZXT-ZQVN<< - coffeecode

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é.
  • Editeur
  • Markdown