Partage

Exercices du cours Bootstrap / Vos questions

9 janvier 2018 à 4:11:40

Il ne devrait rien y avoir en dehors des balises <body> donc ton <div class="container-fluid"> doit se trouver entre les balises <body></body>.
26 janvier 2018 à 18:29:44

Bonjour,

Je bloque sur l'exercice 2 depuis 2 jours et je ne comprend pas pourquoi le titre ne s'aligne pas sur 2 lignes avec le logo pour le format tablette....

voila mon code : 

Merci d'avance ;-)

29 janvier 2018 à 14:36:50

pas la peine de me répondre ;-)

J'ai trouvé!!!

Bon courage pour les suivants.

2 février 2018 à 4:39:58

Bonjour,

Je suis actuellement le cours sur "Prenez en main Bootstrap" et j'aimerais savoir si la classe "section-responsive" existe comme la classe "table-responsive".

Merci d'avance.

-
Edité par Broussou 2 février 2018 à 4:41:59

2 février 2018 à 16:50:02

Bonjour, je bloque au niveau du slider dans l'activité 3 bootstrap. Il y a de chaque coté de ce dernier des marges et je n'arrive pas à les supprimer.

Merci pour vos réponses

Cyril
3 février 2018 à 10:43:59

bonjour , sur le tp3 de bootstrap , je mets en place le carousel  , celui ci se déclenche sur la premiere image , mais ne continue pas .

je ne vois pas d'ou viens le problème .  help?

    ================================================== -->

<div class="row">

 <div class=" col-sm-6 col-md-12 ">    

  <div id="carousel" class="carousel slide" data-ride="carousel">

   <div class="carousel-inner">

    <div class="item-active"><img src="assets/img/archi1.jpg" alt="Architecture">

      <h1 class="carousel-caption">Un design futuriste</h1></div>

    <div class="item"><img src="assets/img/archi2.jpg" alt="Architecture"></div>

    <div class="item"><img src="assets/img/archi3.jpg" alt="Architecture"></div>

    <div class="item"><img src="assets/img/archi4.jpg" alt="Architecture"></div>

   </div>

  </div>

 <a class="left carousel-control" href="#carousel" data-slide="prev">

    <span class="glyphicon glyphicon-chevron-left"></span>

  </a>

  <a class="right carousel-control" href="#carousel" data-slide="next">

    <span class="glyphicon glyphicon-chevron-right"></span>

  </a>

  </div>

</div>

<script src="assets/js/jquery.js"></script>

<script src="assets/js/bootstrap.min.js"></script>

<script src="http://code.jquery.com/jquery-2.2.1.min.js"></script>

    <!-- Corps de page déjà codé

3 février 2018 à 20:03:18

Bonsoir Zarco, vois-tu les chevrons ?

Jean-Yff
4 février 2018 à 15:12:42

bonjour Jean-Yff

en fait j'ai trouvé le problème , j'avais tapé un tiret : - , entre item et active pour la première phot . du coup çà ne fonctionnait pas.

j'ai supprimé le tiret et tout est rentré dans l'ordre .

merci!

10 février 2018 à 10:16:04

Broussou a écrit:

Bonjour,

Je suis actuellement le cours sur "Prenez en main Bootstrap" et j'aimerais savoir si la classe "section-responsive" existe comme la classe "table-responsive".

Merci d'avance.

-
Edité par Broussou 2 février 2018 à 4:41:59


Il existe une classe pour les tableaux; et parmi ces tables; il y'a une classe bien approprié.
h-lone
15 mars 2018 à 17:55:34

Bonjour,

Je commence le cours Bootstrap, il y a des differences d'affichage lors que j'essaie de reproduire les exercices et demonstrations, comme dans le cas de l'utilisation de "offset", je ne sais pas pourquoi, mais à chaque fois, quand j'essaie de sauter des colonnes, ça ne marche pas. 

Et je n'ai fait que copier/coller le cours dans un editeur de code avec "codeply" qui sert à tester des morceaux de code. Peut-etre il y a une erreur dans le cours? je comprends pas... voici le cours en question:

https://openclassrooms.com/courses/prenez-en-main-bootstrap/une-grille#/id/r-1888757

le résultat qui on doit avoir:

Regardez la capture d'ecran avec la copie exacte du cours avec le rendu dans le navigateur:(normalement il doit avoir un espace entre les 4 colonnes en bas à gauche, entre les colonnes, tel quel est montré dans le cours)

Qqn saurait me répondre?

merci.

-
Edité par @Arobase 15 mars 2018 à 17:58:32

Merci beaucoup !
16 mars 2018 à 9:53:54

Bonjour, il serait plus facile de t'aider si tu mettais le code avec bouton "code </>" du forum plutôt qu'en mettant une image. Là j'ai du mal a voir.

Edit : J'ai testé le code du cours qui a l'aire d'être le même que toi dans Codeply et chez moi ça fonctionne. Je ne vois pas d'ou peut venir le problème du coup. 

-
Edité par NicolasLoh 16 mars 2018 à 10:02:21

16 mars 2018 à 10:15:53

Bonjour,

Un détail me saute aux yeux sur ton image : la mention "Bootstrap 4.0-beta.2".

Il y a des différences importantes entre Bootstrap 4 (que tu sembles utiliser) et Bootstrap 3 (version utilisée par le cours), notamment au niveau de la syntaxe.

Je te conseille de commencer par travailler sur la version 3 de Bootstrap ou bien de continuer à travailler sur la version 4 plus récente mais dans ce cas tu devras consulter la documentation du framework pour savoir comment adapter le code du cours. ;)

Recherche l'avis de développeurs front : Devenir un meilleur dev front ?
16 mars 2018 à 10:20:55

Bonjour @Arobas,

j'ai eu le même souci...
En fait, si tu cherches dans bootstrap.css,

"col-lg-offset-4 col-lg-4"


n'est pas défini, du coup impossible qu'il prenne en charge le "saut"...

Il suffit de le remplacer par :

 "offset-4 col-lg-4"


et ça fonctionne ! Heu... normalement... :), puisque offset est défini lui.

Il y aura plusieurs fois ce genre de soucis dans le cours je pense...
Tu dois avoir la version 4 et non 3 de Bootsrap, tout comme moi. :)

J'espère ne pas avoir dit de bêtises, je débute...
Bonne continuation !

P.S :
Messages croisés avec celui de Mewen_bzh... qui a totalement raison !
Et hop je passe sous Bootstrap 3 ; beaucoup plus simple pour suivre le cours, merci ! :D

-
Edité par Kerna 16 mars 2018 à 12:51:51

16 mars 2018 à 15:12:59

Bonjour à tous et à toutes,

En effet, le probleme venait de la version utilisé . Le détail ce que je n'avais pas "choisi" la version 4, en fait je n'ai rien choisi....

Je suis retourné sur codeply et la je vois que la version de booststrap est la 3.3.7, et ça marche tel quel dans le cours.

Merci pour vos réponses.

d'ailleurs, j'ai trouvé un document qui explique de façon très claire la prise en main et l'utilisation de bootstrap:

http://courseware.codeschool.com/blasting_off_with_bootstrap/slides/CodeSchool-BlastingOffWithBootstrap.pdf

-
Edité par @Arobase 16 mars 2018 à 17:15:02

Merci beaucoup !
18 mars 2018 à 10:16:30

Bonjour,

A propos de Bootstrap 4, vu que ça commence à titiller pas mal de monde, y a t'il une date prévue pour la MAJ du cours ?

Merci d'avance

20 mars 2018 à 11:12:13

Hello!

Je viens justement ici pour voir si l'auteur du cours prévoit de préparer un cours sur Bootstrap 4 qui est venu révolutionné les choses avec une simplicité sans précédent.

J'ai remonté le forum et constaté que l'auteur n'est plus réactif depuis janvier. Peut-être la team OC passera par ici pour lire les besoins des gens.

Cdt;

20 mars 2018 à 11:35:03

Bonjour,

Le cours Bootstrap 4 est déjà rédigé depuis quelques temps mais la publication ne dépend pas de moi...

Cordialement

20 mars 2018 à 16:51:23

Bonjour bestmono,

Le cours est sur le lab?

20 mars 2018 à 16:56:43

Non je ne l'ai pas mis sur le lab, c'est devenu un no man's land.
20 mars 2018 à 17:04:03

Effectivement!

J'ai de toutes façons écrit à OC pour ce problème. Peut être que ça va accéler le processus de publication. Ce n'est pas toujours bon d'apprendre un framework/biblio en utilisant des versions obsolète. Ca bouge vite...

21 mars 2018 à 13:51:04

Bonjour à tous !
Merci pour ce cours, il est très bien fait, mais je m'arrache les cheveux sur l'activité 2... :colere:

Sur l'exemple donné les icônes des réseaux sociaux sont de taille réduite ; et bien je ne comprends pas comment faire !!!

Je tourne en rond depuis 2 jours...
Si une bonne âme pouvait m'expliquer vaguement, je ne demande pas la solution, mais juste une piste ; merci :)

Et désolée si la question a déjà été posée, j'ai bien lu les 44 pages mais sans trouver de réponse...
Merci encore ! :)

-
Edité par Kerna 21 mars 2018 à 14:07:48

21 mars 2018 à 14:00:14

Bonjour, donc puisque tu ne veut pas qu'on te donne la solution directement (ce que je comprend ;) ) : c'est juste des images et ça se redimensionne facilement en css des images. Voir le cours sur le HTML et CSS.

-
Edité par NicolasLoh 21 mars 2018 à 14:01:17

21 mars 2018 à 14:13:16

Je crois que je ne vois plus les choses les plus simples à force... :waw:
Shame on me... :euh:
Et merci surtout !!! ;)

21 mars 2018 à 17:01:15

Bonjour,

Regarde les btn-primary, il y a un facteur pas correct peut-être genre fa- 1x, fa  2x, fa- 3x etc. C'est juste une idée !

Bonne continuation.

Jean-Yff
23 mars 2018 à 14:19:44

Bonjour,

bon, c'est encore moi... ^_^
Je continue le cours, et dans la partie : "Configurer en ligne sur le site Bootsrap", j'ai un gros souci...
Si j'appelle bootsrap.min tout fonctionne à merveille, mais lorsque j'appelle bootstrap-theme.min après avoir sélectionné les bonnes options et téléchargé le fichier sur getbootstrap.com bien entendu,  plus rien n'est pris en compte et je me retrouve avec uniquement le style de base de ma feuille css...

  <head>
    <meta charset="utf-8">
      <link href="css/bootstrap-theme.min.css" rel="stylesheet">
    <link href="css/essai_01.css" rel="stylesheet">
  </head>

J'ai la tête en bouillie à force...

Merci pour votre aide. :)

-
Edité par Kerna 23 mars 2018 à 14:23:50

23 mars 2018 à 14:32:48

(Je pars ici du principe que tu suis le cours qui utilise la version 3 de Bootsrap)

Bonjour,

Tu parles du fichier bootstrap-theme disponible ici :  https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css

Si oui attention car bootstrap-theme n'est rien d'autre qu'un thème optionnel pour Bootstrap, une surcouche si tu préfères. Par conséquent bootstrap-theme n'embarque pas le framework Bootstrap. Il doit venir en plus.

C'est bien expliqué dans le doc qui inclut les deux fichiers : 

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">



-
Edité par Mewen_bzh 23 mars 2018 à 14:34:51

Recherche l'avis de développeurs front : Devenir un meilleur dev front ?
23 mars 2018 à 14:39:23

Heu... C'est pas faux... :euh:
Je crois que j'ai besoin d'une pause...  o_O
Merci Mewen_bzh, vraiment ; c'était juste évident...

-
Edité par Kerna 23 mars 2018 à 14:42:55

29 mars 2018 à 13:08:57

Bonjour,

je me demande s'il y a encore beaucoup de monde sur ce cours ?
Je viens d'envoyer mon 2éme TP, et j'en ai 6 à corriger... :euh:

Je vais essayer de tout faire en moins de 24 heures mais bon... o_O

Bonne continuation ! :)

P. S : 

Faites-gaffe à vraiment bien vérifier vos fichiers avant de les envoyer .. 

J'ai revu le mien 20 fois, et je viens de me rendre compte que j'ai envoyé le mauvais par erreur .. 🙄

J'ai comme une furieuse envie de tout foutre en l'air .. 

-
Edité par Kerna 29 mars 2018 à 19:13:18

Exercices du cours Bootstrap / Vos questions

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown