Revenir en haut Aller en bas
Epicode
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Le Deal du moment : -50%
-50% sur les sacs à dos pour ordinateur ...
Voir le deal
19.99 €
Le Deal du moment : -20%
-20% sur le Lot de 2 écrans PC GIGABYTE ...
Voir le deal
429 €

Aller en bas
Milou
Milou
Ancien.ne du staff
  • Date d'inscription : 12/10/2013
  • Messages : 4207
Hola :3 Je viens proposer un petit schéma de catégorie. Vous trouverez toutes les informations sur l'image ;) Amusez-vous bien :P L'idée, c'est que la couleur du fond du bandeau sur lequel est écrit le nom du forum change en fonction des nouveaux messages (ex : bandeau bleu pour pas de news, vert pour un nouveau message et rouge pour un forum verrouillé)
[Intermédiaire] Exercice 7 - Catégories bleues Y3zf
_______________
Mar 13 Mar 2018 - 19:03
Batty
Batty
Ancien.ne du staff
  • Date d'inscription : 05/06/2014
  • Messages : 3514
Merci du partage j'ajoute ton schémas a la liste =)

Voici une liste de tuto qui pourrais vous aider :

Le positionnement
Template index_box (catégorie)
_______________
Jeu 15 Mar 2018 - 17:03
Artemis
Artemis
Admin & serial codeuse - 0% de méchanceté
  • Date d'inscription : 14/01/2017
  • Messages : 3571
Coucou !
Tout d'abord, très joli schéma. *-*

Voici mon résultat :
[Intermédiaire] Exercice 7 - Catégories bleues Eo76

Le CSS :


Template index_box


- Le block bleu - qui change quand il y a un nouveau message - est bêtement une image, c'est une solution simple et efficace. c':
- J'ai mis des position:relative aux éléments présents dans le block bleu pour remplacer le z-index qui ne fonctionne pas sur codepen (je ne sais pas du tout si c'est juste par contre donc j'attends vivement vos avis... >///<), puisque l'image en position: absolute se mettait systématiquement au-dessus des autres éléments.

Voilà voilà ! J'espère que mon code n'est pas trop fouillis haha. c':
_______________


 
Jeu 15 Mar 2018 - 18:56
Reine des Ténèbres
Reine des Ténèbres
Ancien.ne du staff
  • Date d'inscription : 15/08/2017
  • Messages : 3183
Coucou :3

Je vois que tu passes déjà aux templates, tu progresses rapidement, bravo.

Ton code me semble bon en général.
Je trouve que l'idée d'utiliser une image pour les stats des forums est bien pensée.

Pour le z-index, au fait ça n'a rien à voir avec Codepen. Cette plateforme te permet simplement d'avoir un aperçu objectif en temps réel de ton code. La propriété z-index est exclusive aux éléments dont le positionnement n'est pas statique. C'est à dire qu'elle doit toujours être utilisée en compagnie de la propriété "position". Un élément positionné en absolu sort complètement du flux et donc logiquement il passe en dessus des éléments non positionnés.
plus d'infos sur le z-index

Un petit conseil au sujet des préfixes vendeurs. D'abord, pour la propriété box-sizing, le prefixe webkit est toujours d'actualité, tu auras donc :
Code:
-webkit-box-sizing: border-box;
 box-sizing: border-box;

Ceci m'amène donc au petit conseil concernant l'ordre des propriétés, sache que par convention, la propriété est mise après les propriétés préfixées. Donc il sera plus conventionnel de mettre
Code:
-o-object-fit: cover;
 object-fit: cover;
Ceci n'a pas d'impact sur le résultat du code mais ça l'aura pour des propriétés plus complexes qui présentent des différences entre l'affichage de la propriété et de son nom préfixé selon les différents navigateurs.
En tout cas bravo [Intermédiaire] Exercice 7 - Catégories bleues 3775839356

La prochaine fois que tu codes un templates (parce qu'on espère te revoir dans la section) pense à mettre l'aperçu du résultat sur un forum test plutôt qu'un screen.

A bientôt :3
_______________
Mer 28 Mar 2018 - 0:42
Artemis
Artemis
Admin & serial codeuse - 0% de méchanceté
  • Date d'inscription : 14/01/2017
  • Messages : 3571
Coucou !
Merci pour tes conseils ! Je comprends mieux l'utilisation du z-index à présent Super héro
Je ne savais pas du tout qu'il fallait mettre les propriétés préfixées avant ses homologues, je m'en souviendrai pour les prochaines fois. plz
D'ailleurs le résultat est toujours visible sur mon petit forum test http://artemis-test.forumactif.com/ ; je me passerai des screens à l'avenir. Coeur 2

Merci d'avoir pris le temps de commenter mon code ! c:
_______________


 
Sam 31 Mar 2018 - 10:03
Reine des Ténèbres
Reine des Ténèbres
Ancien.ne du staff
  • Date d'inscription : 15/08/2017
  • Messages : 3183
C'est un plaisir @Artemis
Au fait j'ai oublié de le mentionner mais il vaut mieux mettre le script directement après la partie concerné par celui-ci.
_______________
Lun 2 Avr 2018 - 14:21
Artemis
Artemis
Admin & serial codeuse - 0% de méchanceté
  • Date d'inscription : 14/01/2017
  • Messages : 3571
Coucou ! C'est noté, merci pour la précision. *-*
_______________


 
Mar 3 Avr 2018 - 14:26
Contenu sponsorisé
    _______________
    Revenir en haut