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 :
Manga Chainsaw Man : où acheter le Tome 17 ...
Voir le deal
19.99 €
Le Deal du moment : -50%
-50% Baskets Nike Air Huarache
Voir le deal
64.99 €

Aller en bas
Milou
Milou
Ancien.ne du staff
  • Date d'inscription : 12/10/2013
  • Messages : 4207
Voilà un nouveau schéma de catégorie. Je pense n'avoir rien oublié dans les infos, j'espère que vous vous amuserez (ou pas) avec cet exercice :3

[Intermédiaire] Exercice 8 - Catégories oranges Vyhb
Les images nécessaires:
_______________
Ven 1 Juin 2018 - 15:09
Cheshire Cat
Cheshire Cat
Accro au forum
  • Date d'inscription : 15/12/2012
  • Messages : 4814
Coucou !

C'est ajouté à l'index [Intermédiaire] Exercice 8 - Catégories oranges 3775839356
_______________
Ven 1 Juin 2018 - 15:19
Tetsu
Tetsu
Newbie
  • Date d'inscription : 12/08/2018
  • Messages : 42
Bonjour [Intermédiaire] Exercice 8 - Catégories oranges 3775839356 (ou plutôt bonsoir vu l'heure [Intermédiaire] Exercice 8 - Catégories oranges 3655035957 ) J'ai flashé sur ces catégories alors je me suis laissée tenter par l'exercice Panique J'espère que cela conviendra Very Happy



Merci pour votre attention [Intermédiaire] Exercice 8 - Catégories oranges 3655035957
_______________
Sam 18 Aoû 2018 - 1:55
Kayl
Kayl
Ancien.ne du staff
  • Date d'inscription : 12/05/2018
  • Messages : 200
BONJOUR avec du retard °° Moi aussi j’aime cette maquette tiens :D

Alors perso sur mon forum, l’image nouveau/old se barre à 3km /paf/ Sinon le rendu est bien **

• Du coup analysons le code °^° (à partir de BEGIN catrow évidemment). Déjà la première chose que je vois est une balise center que j’aime pas beaucoup. On a quelques différends elle et moi du coup je l’ai remplacée, fais en autant :Oo:
En vrai, la balise center est obsolète, donc on ne devrait plus l’utiliser. À la place, on utilise dans le CSS :

margin: auto;
Pour centrer un élément comme un bloc.

text-align: center;
Pour centrer le texte à l’intérieur de son bloc.

Je crois que c’est tout pour le HTML, mais je vais regarder le CSS °°

• Déjà je vois des display flex, des display inline-block et des position. Bon en soi, le rendu est là, mais mieux vaut ne pas tout mélanger et choisir soit le display, soit les position. À toi de voir ce que tu maîtrises le mieux, c’est vrai que le display flex est intéressant °^°
Perso je prends plutôt de l’inline-block, mais c’est par habitude xD

Ici en l’occurrence, ta classe .cadrenb contient un display: inline-block qui n’est pas utile °° De même que euh .titrefor et c’est tout [Intermédiaire] Exercice 8 - Catégories oranges 3313101865
Et le display: flex de l’image new/old est inutile aussi en fait, comme l’autre qui se trouve dans .cadrefor

Voilà côté display c’est tout, tu peux retirer ça et rien ne va bouger /paf/

• Euh ensuite donc, l’image qui s’en va à 3 km :
Spoiler:

Elle est dans une div, mais c’est pas nécessaire non plus. Tu peux mettre ta class directement dans la balise img comme ceci :

Code:
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" class="cadreimg" />

Sinon, c’est parce qu’elle est en float, du coup elle va à droite par rapport au bloc qui la contient (donc ici, l’intérieur du forum)

Donc si tu veux garder ton float pour que l’image parte à droite, faudrait englober tout ton truc (ou juste ton bloc forums + l’image) d’un autre bloc, qui aurait donc 780px de large à peu près, enfin les dimensions du bloc + celle de l’image genre comme ça :

Code:
<!-- BEGIN forumrow -->
<div class="general">
<img class="cadreimg" …
<div class="cadrefor"> … </div>
</div>
 <!-- END forumrow -->

Et dans le CSS :

Code:
.general {
   width: 750px;
   margin: auto;
}

Et tu peux juste mettre un float: right; pour ton image, sans rien de plus °°

• Euh en fait c’est tout °° Fin je crois /paf/

Du coup voilà 2-3 petits trucs à modifier, mais c’est pas mal quand même :D
_______________
Sam 8 Sep 2018 - 18:51
Alek
Alek
Ancien.ne du staff
  • Date d'inscription : 20/01/2018
  • Messages : 2520
merci milou pour ses jolies catégories Coeur 2

le rendu :
[Intermédiaire] Exercice 8 - Catégories oranges Captur13

le code :


il y a quelques petits détails qui ne fonctionnent pas ou mal ;
- les sous-forums ne s'affichent pas ; je sais pas si ça viens de mon code ou d'une case pas cochée quelque part [Intermédiaire] Exercice 8 - Catégories oranges 3313101865
- pour je ne sais pour qu'elle sombre raison, le hover - seconde catégorie sur le rendu - ce réduit de plus en plus en fonction de la taille de la description
- il y a un absolue pour placer les images new/old (et je ne vois pas comment faire ça proprement) [Intermédiaire] Exercice 8 - Catégories oranges 3655035957
_______________
Jeu 25 Juin 2020 - 22:08
Contenu sponsorisé
    _______________
    Revenir en haut