Partage
  • Partager sur Facebook
  • Partager sur Twitter

Problème pour mettre un titre au centre

Sujet résolu
    7 février 2020 à 20:39:15

    Bonjour,

    Je suis débutant en html/css et je regarde donc un tuto pour m'instruire hors je bloque a un moment de la video ou il créer un titre

    <h2 class="subtitle heading-site">Mon portfolio</h2>

    avec cette ligne et avec ceci sur le main.css

    /*
    GLOBAL
    */
    .heading-site {
        text-align: center;
        font-family: 'Montserrat', sans-serif;
    }
    
    

    donc ceci est issu de mon écriture, normalement c'est sencé ce mettre au centre mais rien..

    voici ce que ça me fait :

    et voici ce que je devrais avoir normalement:

    voici ma ligne de code sur l'index, le main.css est cité plus haut

            <!-- portfolio -->
            <div class="block">
                <h2 class="subtitle heading-site">Mon portfolio</h2>
                <div class="container">
                    <div class="tile is-ancestor">
                        <div class="tile is-vertical is-8">
                        <div class="tile">
                            <div class="tile is-parent is-vertical">
                            <article class="tile is-child box">
                                <div class="notification">Contient une photo</div>
                            </article>
                            <article class="tile is-child box">
                                <!-- Put any content you want -->
                            </article>
                            </div>
                            <div class="tile is-parent">
                            <article class="tile is-child box">
                                <!-- Put any content you want -->
                            </article>
                            </div>
                        </div>
                        <div class="tile is-parent">
                            <article class="tile is-child box">
                            <!-- Put any content you want -->
                            </article>
                        </div>
                        </div>
                        <div class="tile is-parent">
                        <article class="tile is-child box">
                            <!-- Put any content you want -->
                        </article>
                        </div>
                    </div>
                </div>
            </div>
            <!-- portfolio -->

    voici également la vidéo et le passage : https://youtu.be/MzAeV2BdzRg?t=2503

    Merci



    • Partager sur Facebook
    • Partager sur Twitter
      8 février 2020 à 8:04:08

      Bonjour,

      Peux-tu nous montrer tout le code CSS ? Car tu dois avoir une propriété qui empêche ton h2 de se centrer

      • Partager sur Facebook
      • Partager sur Twitter

      Postez votre code et vos msg d'erreurs - "ça marche pas" n'est pas un message d'erreur ...

      Anonyme
        9 février 2020 à 12:57:31

        Bonjour,

        Fais un truc comme ça simple comme ça directement dans le HTML :

        <div align="center">
             <h2>Mon portfolio</h2>
        </div>

        -
        Edité par Anonyme 9 février 2020 à 12:57:52

        • Partager sur Facebook
        • Partager sur Twitter
          9 février 2020 à 13:05:20

          du coup j'ai réussi je pense que j’avais oublié un chevron ou quelque chose comme ça en tout cas merci à vous !
          • Partager sur Facebook
          • Partager sur Twitter
            9 février 2020 à 13:07:17

            Noa_LXA a écrit:

            Bonjour,

            Fais un truc comme ça simple comme ça directement dans le HTML :

            <div align="center">
                 <h2>Mon portfolio</h2>
            </div>

            -
            Edité par Noa_LXA il y a 9 minutes

            L'attribut align n'est pas supporté en HTML5 (Déprécié) -> Utiliser le css pour cela

            Lire : https://stackoverflow.com/questions/14551305/align-attribute-deprecated

            -
            Edité par Mehddii 9 février 2020 à 13:09:00

            • Partager sur Facebook
            • Partager sur Twitter

            Postez votre code et vos msg d'erreurs - "ça marche pas" n'est pas un message d'erreur ...

            Anonyme
              9 février 2020 à 13:39:14

              Mehddii a écrit:

              Noa_LXA a écrit:

              Bonjour,

              Fais un truc comme ça simple comme ça directement dans le HTML :

              <div align="center">
                   <h2>Mon portfolio</h2>
              </div>

              -
              Edité par Noa_LXA il y a 9 minutes

              L'attribut align n'est pas supporté en HTML5 (Déprécié) -> Utiliser le css pour cela

              Lire : https://stackoverflow.com/questions/14551305/align-attribute-deprecated

              -
              Edité par Mehddii il y a 21 minutes


              Pour ma part ça fonctionne.

              Par contre son CSS est un peu bizarre je trouve.Il a mit comme classe pour son h2 "subtitle heading-site" et dans son CSS il a défini des paramètres pour "heading-site".

              il a bien mit

              <link rel="stylesheet" type="text/css" href="son_fichier_css">

              ?

              -
              Edité par Anonyme 9 février 2020 à 13:40:08

              • Partager sur Facebook
              • Partager sur Twitter
                9 février 2020 à 14:18:33

                Je n'ai pas dit que ça fonctionnait pas, mais c'est déprécié, et il est plus logique d'avoir tout ce qui concerne le style dans un fichier CSS à part

                > Par contre son CSS est un peu bizarre je trouve.Il a mit comme classe pour son h2 "subtitle heading-site" et dans son CSS il a défini des paramètres pour "heading-site".

                Et non on peut très bien séparer les class par des espaces dans le html pour cibler le même élément depuis deux classes différentes : https://www.codecademy.com/forum_questions/506d1cacc968bc00020514ae



                • Partager sur Facebook
                • Partager sur Twitter

                Postez votre code et vos msg d'erreurs - "ça marche pas" n'est pas un message d'erreur ...

                Anonyme
                  9 février 2020 à 14:29:06

                  C'est ce que je dis, il peut quand même tenter le coup. Normalement ça fonctionne. 



                  -
                  Edité par Anonyme 9 février 2020 à 14:36:45

                  • Partager sur Facebook
                  • Partager sur Twitter
                    9 février 2020 à 14:46:32

                    @Noa_LXA Bonjour, votre solution fonctionne mais n'est pas valide.

                    De même que vous pouvez avoir une balise <Noa_LXA> et la styliser en CSS cela fonctionnera mais n'est pas valide car pas de l'HTML. 

                    Ce qui est déprécier par le w3c sera supprimé dans la prochaine version du langage, il n'est donc pas conseillé de l'utiliser.

                    Merci de lire la note dans la documentation.  Et de passer votre code au validateur pour voir vos erreurs => https://validator.w3.org/

                    KenzoKbn a écrit:

                    du coup j'ai réussi je pense que j’avais oublié un chevron ou quelque chose comme ça en tout cas merci à vous !

                    Merci de noter le sujet comme résolu.

                    Sujet résolu

                    Tu peux passer le sujet à "résolu" (bouton en haut à droite du sujet) et cliquer sur les pouces levés des messages qui t'ont aidé⋅e ;)

                    -
                    Edité par AbcAbc6 9 février 2020 à 14:47:29

                    • Partager sur Facebook
                    • Partager sur Twitter

                    Problème pour mettre un titre au centre

                    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                    • Editeur
                    • Markdown