avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Ven 22 Juin 2018 - 15:20
C'est mieux de les enlever comme ça tu auras le width:100% par défaut.

Si tu modifies les width tu auras toujours une différence entre le content-box et le border-box.


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Ven 22 Juin 2018 - 16:18
D'accord !



Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Ven 22 Juin 2018 - 18:47
ça fonctionne, c'est juste qu'il y a deux fois le CSS à cause de la fiche du message précédent, tu peux enlever l'aperçu de la fiche dans le premier message où il y avait les width.


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 12:45
Et voilà :3


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 14:02
C'est parfait :3

Tu peux augmenter la hauteur dans h1 pour avoir de l'espace entre le titre et la phrase.
Sinon c'est terminé, si tu veux tu peux mettre la fiche en LS :3


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 16:26
Hey :3
J'ai beau augmenté, sur Epi ça reste pareil >_<
Je vais de ce pas la mettre ! :3


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 19:08
Après avoir fait de multiples modifs voici le rendu :

Titre de la fiche

une jolie bannière

feat Reine

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Illum magnam aperiam repudiandae laborum dicta nesciunt autem ut, sit obcaecati temporibus sequi placeat excepturi quod nostrum, quibusdam distinctio vel cumque, perspiciatis?Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vero odit aperiam corporis recusandae, eos nam porro ut, vel, consectetur voluptate libero eum tenetur dolores voluptatem aliquid quos odio perspiciatis sunt?

Codage de la fiche par Caroline pour Epicode


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 20:08
Tu refais un doublons Caro x) *sort le fouet*

C'est parce que tu as du faire la même erreur qu'avant, il faut supprimer le premier code sinon tu auras deux fois le même CSS et le navigateur applique le premier en priorité. :3


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 20:12
*fuit*

Et là c'est bon ? **


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 20:13
Oui là tu peux éditer et changer la hauteur et ça devrait fonctionner :3


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 20:19
La hauteur pour le titre ? J'ai beau la modifier ça reste toujours pareil >_<


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 20:23
c'est bizarre, voilà j'ai mis 60px pour toi xD


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 20:28
Mais ça déborde du border nan ? :o


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 23 Juin 2018 - 20:31
Si, il faut augmenter la hauteur totale de la fiche ou l'enlever carrément pour que ça soit automatique. J'ai pas touché au reste du coup, j'ai juste augmenté la hauteur du titre parce que tu disais que c'était impossible ça m'a semblé bizarre.


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Sam 30 Juin 2018 - 17:17
C'est bon ! :3


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Mar 3 Juil 2018 - 14:27
C'est super bravo pour cette première fiche :3

Voici un autre exercice simple fiche izusa normalement nous avons un titre, un sous-titre, un paragraphe pour la description et un lien pour le crédit.

Je te laisse faire un essai par toi-même déjà.


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Mar 3 Juil 2018 - 14:36
Merci beaucoup o//////o

Je tente ça dans la soirée à part si j'ai le temps avant ! :3


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Mar 3 Juil 2018 - 14:51
D'accord, prends ton temps.


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Jeu 12 Juil 2018 - 16:14
Hey désolée pour le retard ! Voici ma fiche !

Code:
<div class="CaRoLiNe_Bloc"><h1>Titre de la fiche</h1><h2>Titre secondaire</h2><p>Accedat huc suavitas quaedam oportet sermonum atque morum, haudquaquam mediocre condimentum amicitiae. Tristitia autem et in omni re severitas habet illa quidem gravitatem, sed amicitia remissior esse debet et liberior et dulcior et ad omnem comitatem facilitatemque proclivior.Quis enim aut eum diligat quem metuat, aut eum a quo se metui putet? Coluntur tamen simulatione dumtaxat ad tempus. Quod si forte, ut fit plerumque, ceciderunt, tum intellegitur quam fuerint inopes amicorum. Quod Tarquinium dixisse ferunt, tum exsulantem se intellexisse quos fidos amicos habuisset, quos infidos, cum iam neutris gratiam referre posset.Tempore quo primis auspiciis in mundanum fulgorem surgeret victura dum erunt homines Roma, ut augeretur sublimibus incrementis, foedere pacis aeternae Virtus convenit atque Fortuna plerumque dissidentes, quarum si altera defuisset, ad perfectam non venerat summitatem.Alii nullo quaerente vultus severitate adsimulata patrimonia sua in inmensum extollunt, cultorum ut puta feracium multiplicantes annuos fructus, quae a primo ad ultimum solem se abunde iactitant possidere, ignorantes profecto maiores suos, per quos ita magnitudo Romana porrigitur, non divitiis eluxisse sed per bella saevissima, nec opibus nec victu nec indumentorum vilitate gregariis militibus discrepantes opposita cuncta superasse virtute.Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut appellant Christiani diaconus, cuius prolatae litterae scriptae Graeco sermone ad Tyrii textrini praepositum celerari speciem perurgebant quam autem non indicabant denique etiam idem ad usque discrimen vitae vexatus nihil fateri conpulsus est.</p><div class="CaRoLiNe_Credits"> Codage de la fiche par (Name) pour <a href="http://www.epicode-entraide.com/">Epicode</a></div><link href="https://fonts.googleapis.com/css?family=Alegreya|Sacramento" rel="stylesheet"><style>.CaRoLiNe_Bloc{background:black;width:540px;border:10px double grey;margin:0 auto;text-align:center}.CaRoLiNe_Bloc h1{color:white;text-align:center;height:30px;font-family:'Sacramento',cursive}.CaRoLiNe_Bloc h2{color:white;height:40px;background:grey;width:450px;margin:auto;border-radius:15px;border:10px solid black;font-family:'Sacramento',cursive}.CaRoLiNe_Bloc p{color:white;background:grey;width:450px;margin:auto;border-radius:15px;height:400px;overflow:auto;border:10px solid black;font-family:'Alegreya',serif}.CaRoLiNe_Credits{color:white;background:grey;height:40px;width:450px;margin:auto;border-radius:15px;border:10px solid black;font-family:'Alegreya',serif}.CaRoLiNe_Credits a{text-decoration:none;color:white}</style>

Titre de la fiche

Titre secondaire

Accedat huc suavitas quaedam oportet sermonum atque morum, haudquaquam mediocre condimentum amicitiae. Tristitia autem et in omni re severitas habet illa quidem gravitatem, sed amicitia remissior esse debet et liberior et dulcior et ad omnem comitatem facilitatemque proclivior.Quis enim aut eum diligat quem metuat, aut eum a quo se metui putet? Coluntur tamen simulatione dumtaxat ad tempus. Quod si forte, ut fit plerumque, ceciderunt, tum intellegitur quam fuerint inopes amicorum. Quod Tarquinium dixisse ferunt, tum exsulantem se intellexisse quos fidos amicos habuisset, quos infidos, cum iam neutris gratiam referre posset.Tempore quo primis auspiciis in mundanum fulgorem surgeret victura dum erunt homines Roma, ut augeretur sublimibus incrementis, foedere pacis aeternae Virtus convenit atque Fortuna plerumque dissidentes, quarum si altera defuisset, ad perfectam non venerat summitatem.Alii nullo quaerente vultus severitate adsimulata patrimonia sua in inmensum extollunt, cultorum ut puta feracium multiplicantes annuos fructus, quae a primo ad ultimum solem se abunde iactitant possidere, ignorantes profecto maiores suos, per quos ita magnitudo Romana porrigitur, non divitiis eluxisse sed per bella saevissima, nec opibus nec victu nec indumentorum vilitate gregariis militibus discrepantes opposita cuncta superasse virtute.Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut appellant Christiani diaconus, cuius prolatae litterae scriptae Graeco sermone ad Tyrii textrini praepositum celerari speciem perurgebant quam autem non indicabant denique etiam idem ad usque discrimen vitae vexatus nihil fateri conpulsus est.

Codage de la fiche par (Name) pour Epicode


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Jeu 12 Juil 2018 - 22:38
Coucou Caroline :3

Ah tu tombes à pic avec mon retour :3

Tu as fait du très bon travail pour cette fiche bravo, je me sens plutôt fière :3

Je n'a rien à dire pour sur ton HTML, il est parfait.
Pour le CSS j'ai que quelques petites remarques :

Pour le bloc parent je vois la propriété position

Code:
.CaRoLiNe_Bloc {
  background: black;
  height: 600px;
  width: 540px;
  border: 10px double grey;
  margin: 0 auto;
  text-align: center;
  /*position: center;*/
}

On centre un bloc avec un margin: auto ce qui est fait et le contenu du bloc avec text-align: center ce qui est là aussi.
La propriété position ne prend pas center comme valeur et n'a pas vraiment sa place ici. On verra à quoi sert cette propriété un peu plus tard.

Pour les autres bloc h2, p et la div du crédit, tu as mis un margin-left: 45px. Je ne sais pas si c'est fait exprès ou pas mais ça fait que le contenu n'est pas vraiment au centre de la fiche mais plutôt à 45px du bord gauche. Du coup il y a moins d'espace à droite. Ici je rappelle que pour centrer un bloc on doit avoir les marges horizontales en auto.

Pour les titres h1 et h2, ils sont petits sur le forum parce qu'ils prennent la valeur du CSS du forum. Tu peux donc changer la taille avec un font-size.

En tout cas j'aime bien ce que tu as fait c'est très bien, bravo :3

Si tu as des questions n'hésite pas :3


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Dim 15 Juil 2018 - 11:21
Hey !
C'est bon j'ai fait les quelques modifs même si j'ai du rajouter des erreurs >_<


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Dim 15 Juil 2018 - 15:32
C'est bien. Tu n'as pas mis de taille pour les titres mais bon ce n'est pas obligatoire non plus.
Ah et tu as mis une bordure noire à tex blocs alors que le fond est noir donc elle sert à rien vu qu'elle est invisible.

Ah et un petit conseil, perso je préfère ne pas mettre de hauteur au bloc parent. C'est mieux quand il s'ajuste automatiquement à la longueur de son contenu. Sinon tu risques d'avoir le contenu qui dépasse ou trop de vide à la fin si la hauteur n'a pas été bien calculée.


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Mar 17 Juil 2018 - 14:28
J'ai préféré ne pas mettre de taille pour les titres car pour moi ils étaient bien comme ça :3
J'ai donc enlevé la hauteur du bloc :3


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
avatar
Sexe : Féminin
Date d'inscription : 15/08/2017
Messages : 2858
Rose des sables Designer
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Mar 17 Juil 2018 - 14:42
D'accord, c'est bon ainsi :3

Je te donne un autre exercice avant de reprendre de nouvelles choses. C'est un exo un peu plus difficile que je donne à tous mes élèves. Si tu le réussis tu pourras faire toutes sortes de fiche simple sans problème.

Exercice - Fiche simple

Tu peux garder le titre et la bannière droits pour l'instant, on verra comment faire l'inclinaison après.

Si tu as des difficultés n'hésite pas à me demander ou si tu veux on peut le faire ensemble aussi :3


avatar
Sexe : Féminin
Date d'inscription : 07/05/2017
Messages : 1229
Anim' & Potterhead lapine
Voir le profil de l'utilisateur
# Re: Classe N°6 | Carolinele Mar 17 Juil 2018 - 14:44
Hey ! Je m'y met de ce pas !
En attendant peut tu regarder quelques fiches que j'ai faites après qu'Arte m'ait monter comment faire ? Elles se trouvent à cette adresse : https://codepen.io/collection/AkBKgY/#


Merchiiii Moses ♥️ ♥️  plz  Coeur 2






Cadeaux :

By Reine :

By Chhaya :

By Naüt :

By Nox :
Contenu sponsorisé
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum