Partage
  • Partager sur Facebook
  • Partager sur Twitter

Placer un paragraphe a droite de ma page

Sujet résolu
    1 avril 2020 à 21:15:09

    Bonsoir je souhaite placer un paragraphe a droite de ma page mais ça ne fonctionne pas.

    J'ai écris ceci en CSS :

    #connexion
    {
        text-align: right;
        font-size:1.2em;
        border: 1px solid black;
        display: inline-block;
        padding:2px
    
    }



    -
    Edité par PetitGeekPY 2 avril 2020 à 10:13:51

    • Partager sur Facebook
    • Partager sur Twitter
      1 avril 2020 à 21:19:09

      Bonjour,

      >> mais ça ne fonctionne pas

      Manque de précisions

      Vous êtes ici sur un forum d'entraide communautaire et non pas sur un forum de demande de service, le but n'est donc pas de fournir une réponse toute faite ou de directement fournir la solution à quiconque viendrait sans la moindre trace. Afin d'obtenir de l'aide et une solution à votre problème, il est fortement recommandé de présenter clairement l'état actuel du problème en nous fournissant :

      • Un descriptif clair et précis du problème
      • La tentative actuelle de résolution que vous avez effectué
      • Le résultat attendu et le résultat actuel
      • Toutes pistes de recherches pouvant aider à la résolution

      Mauvais titre

      Le titre est un élément important qui ne doit pas être négligé. N'oubliez pas cette règle simple : le titre idéal résume la question que vous allez poser en une petite phrase. Il doit permettre aux visiteurs de se repérer facilement dans le forum visité et d'identifier le sujet à sa seule lecture.

      Vous pouvez utiliser divers préfixes comme [Erreur], [MySQL], [Compatibilité], etc... Aussi, pensez à consulter les règles propres à chaque forum (visibles dans les topics épinglés en haut des sections).

      De plus, choisir un bon titre permet de rendre plus faciles les recherches des autres membres.

      Les titres de type "besoin d'aide" ou "problème" ne sont pas tolérés.

      Pour modifier votre titre, éditez le premier message de votre sujet.

      (titre originel : Text-align)

      Liens conseillés


      Bonsoir, quel est le HTML correspondant?

      • Partager sur Facebook
      • Partager sur Twitter
        1 avril 2020 à 22:26:01

        Bonjour est-ce que l'id que tu cible existe bien dans ton document et est-ce qu'il et présent une seule fois , est ce que tu as bien appelé le fichier css en question est-ce que tu à vérifié que le chemin d'appel du fichier css et valide .

        Si le problème persiste est-ce que tu peut nous montré le contenu du document HTML ainsi que le résultat actuel "qui ne fonctionne pas" , par une capture d'écran où un court text descriptif pour qu'on et les données néccessaire pour pouvoir t'aidé.

        • Partager sur Facebook
        • Partager sur Twitter

        suggestion de présentation.

          1 avril 2020 à 22:40:29

          Bonjour,

          text-align: right sert à aligner le contenu de ton paragraphe à droite et non pas à placer le paragraphe lui-même à droite.

          • Partager sur Facebook
          • Partager sur Twitter
          Je ne réponds pas aux messages privés.
            1 avril 2020 à 23:18:01

            Oui l'id est le seul dans le fichier html, oui le fichier est bien lier correctement.

            Je vous montre mon exercice:

            HTML:

            <!DOCTYPE html>
            
            <html>
            
                <head>
                    <title>Exercice</title>
                    <meta charset="utf-8">
                    <link rel="stylesheet" type ="text/css" href="Openclassroom_1.7(Margin_Padding).css">
                </head>
            
                <body>
                    <header>
                        <img src="image_css/CCI.jpg" alt="logo">
                        <p id ="connexion">Connexion</p>
                        <nav>
                            <div><span id="serveur">Serveur</span><span id="cuisine">Cuisine</span><span id="patissier">Patissier</span><span id="plongeur">Plongeur</span></div>
                        </nav>
                        
                    </header>
            
                    <section>
                        <h1>CCI Sud Formation Montpellier</h1>
                        <p id="p_01">CCI Sud Formation Montpellier est l’un des 14 établissements composant le réseau CCI Sud Formation CFA Occitanie, premier formateur régional en alternance.</p>
                        <center><img src="image_css/cuisine_restaurant.jpg" alt="Job"></center> <!-- <centre> une balise si le css ne fonctionne pas-->
                    </section>
            
            
                    
            
            
                </body>
            
            
            </html>

            CSS:

            /* --------------------HEADER-----------------*/
            
            #serveur
            {
                font-size: 1.5em;
                border: 2px solid black;
                padding: 5px;
                margin: 5px
                
            }
            
            #cuisine
            {
                font-size: 1.5em;
                border: 2px solid black;
                padding: 5px;
                margin: 5px
            }
            
            #patissier
            {
                font-size: 1.5em;
                border: 2px solid black;
                padding: 5px;
                margin: 5px
            }
            
            #plongeur
            {
                font-size: 1.5em;
                border: 2px solid black;
                padding: 5px;
                margin: 5px
            }
                
            
            #connexion
            {
                text-align: right;
                font-size:1.2em;
                border: 1px solid black;
                display: inline-block;
                padding:2px
            
            }
            
            /* --------------------HEADER-----------------*/
            
            h1,h2
            {
                color:tomato;
                font-size:3em;
                text-align: center;
            }
            
            #p_01
            {
                text-align: center;
            }

            Je début merci pour votre indulgence :)


            • Partager sur Facebook
            • Partager sur Twitter
              1 avril 2020 à 23:37:15

              Bonsoir.

              Le message du membre du Staff n'est pas une suggestion, mais une obligation.

              • Partager sur Facebook
              • Partager sur Twitter

              Face a quelqu'un pour qui l'on n'éprouve que de l'aversion et du mépris, les yeux d'un homme deviennent extrêmement froids et cruels.

                2 avril 2020 à 0:11:13

                Merci de modifier le titre de votre sujet.

                Non la balise <center> n'est pas la pour remplacer le CSS. Ce sont deux langages différent, le HTML pour la structuration des données du document, le CSS pour la mise en forme. La balise <center> est obsolète depuis 1999 elle n'est plus à utiliser. A supprimer de toute urgence;

                Un paragraphe est une subdivision d'un texte. Ton paragraphe "Connexion" n'est pas une subdivision de texte, donc ce n'est  pas la bonne balise.

                Pour <nav> c'est une navigation, en tant que tel elle devrait contenir des liens, balise <a>.

                Concernant le CSS, tu as de la redondance, tu écris les même propriétés pour plusieurs sélecteur, dans ce cas l'usage d'une class est plus approprié.

                Pour éviter la redondance avec des identifiants, tu peux les regrouper en les séparant par une virgule. Exemple:

                #serveur , #cuisine, #patissier, #plongeur 
                            {
                                font-size: 1.5em;
                                border: 2px solid black;
                                padding: 5px;
                                margin: 5px
                
                            }

                La propriété font-size tu peux même l'indiquer sur le body, de cette façon tu utilises l'héritage puisque cette propriété le permet.

                Pour ton problème d'alignement je te propose  de modifier le HTML pour rajouter un conteneur de sorte à pouvoir faire usage de flexbox. Soit 

                    <body>
                        <header>
                            <div class="conteneur">
                                <img src="image_css/CCI.jpg" alt="logo">
                                <div id ="connexion"><a href="#">Connexion</a></div>
                            </div>

                Avec

                            .conteneur {
                                display: flex;
                                justify-content: space-between;
                            }

                et plus besoin de certaine propriété pour #connexion

                #connexion
                            {
                                /*text-align: right;*/
                                font-size:1.2em;
                                border: 1px solid black;
                                /*display: inline-block;*/
                                padding: 10px;
                            }


                Pour conclure, utilise de préférence les class en CSS et laisse les identifiants pour le javascript et les ancres, c'est une question de poids des déclaration.

                • Partager sur Facebook
                • Partager sur Twitter
                  2 avril 2020 à 10:18:35

                  Merci beaucoup je comprend mieux maintenant :)
                  • Partager sur Facebook
                  • Partager sur Twitter

                  Placer un paragraphe a droite de ma page

                  × 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