2017-04-12 4 views
-2

J'essaie de faire en sorte que mon texte h1 ne soit pas écrasé vers la gauche. J'utilise aussi bootstrap donc je ne suis pas sûr que les effets quoi que ce soit:Pourquoi ne puis-je pas appliquer de marge à mon élément H1?

h1 { 
 
    margin: 5px 40px 10px 70px; 
 
}
<html> 
 
    
 
    <head> 
 
    
 
    <script src="https://use.fontawesome.com/d712ea1844.js"></script> 
 
    
 
    
 
    <title>About Mike</title> 
 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> 
 
    <link type="text/css" href="css/a1.css" rel="stylesheet"> 
 
    
 
    </head> 
 
    
 
    <body> 
 
     <nav class="navbar navbar-inverse"> 
 
      <div class="container-fluid"> 
 
      <!-- Brand and toggle get grouped for better mobile display --> 
 
       <div class="navbar-header"> 
 
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> 
 
         <span class="sr-only">Toggle navigation</span> 
 
         <span class="icon-bar"></span> 
 
         <span class="icon-bar"></span> 
 
         <span class="icon-bar"></span> 
 
        </button> 
 
        <a class="navbar-brand" href="#">About Mike</a> 
 
       </div> 
 
    
 
       <!-- Collect the nav links, forms, and other content for toggling --> 
 
       <div class="collapse navbar-collapse text-center" id="bs-example-navbar-collapse-1"> 
 
        <ul class="nav navbar-nav"> 
 
         <li class="active"><a href="../index.html">Home<span class="sr-only">(current)</span></a></li> 
 
         <li><a href="#">Resume</a></li> 
 
         <li><a href="artifact1/ArtifactPage1.html">Artifact 1</a></li> 
 
         <li><a href="../artifact2/ArtifactPage2.html">Artifact 2</a></li> 
 
        </ul> 
 
       </div> 
 
      </div> 
 
     </nav> 
 
       
 
     
 
      <h1 id="annoyingtitle">Examples of Work</h1> 
 
      <p id="p0">This is an example of a paper I wrote while I attended Frankline Pierce University. In this paper I look at the lenses at which mental illness is viewed in different parts of the world.</p> 
 
    <br/> 
 
     
 
     <A id="mentallink" HREF="mentalillness.docx">Mental Illness Cultural Lenses and Barriers</A> 
 
     
 
    <br/> 
 
    
 
     
 
    <p id="p1"> \t Reflection: Writing this essay was easily one of my hardest assignments I have ever done. It involved levels of research that I hadn’t done before. I learned how to form an argument while drawing evidence from multiple sources. This has helped me in my research and writing skills. My favorite part of writing this paper was doing the research. On this assignment we were allowed to pull sources from almost anywhere as long as they were credible, I enjoyed being able to go as far as my mind could take me. The one risk I believe I took with this project was the structure and flow. The entire assignment was 9 pages long. This made my biggest problem getting it all to flow together and getting my ideas in the right order. If I could re-do this assignment I wish I would write a better conclusion to the paper. </p> 
 
    <br/> 
 
    
 
    <div id="annoying"> 
 
     <ul id="list1" class="text-center list-unstyled"> 
 
      <li class="col-md-4"> <i class="fa fa-lg fa-twitter-square" aria-hidden="true"></i> 
 
       <br> 
 
       <a href="https://twitter.com/m">@M</a> 
 
      </li> 
 
      <li class="col-md-3"> <i class="fa fa-lg fa-facebook-official" aria-hidden="true"></i> 
 
       <br> 
 
       <a href="https://www.facebook.com/mike">mike</a> 
 
      </li> 
 
      <li class="col-md-3"> <i class="fa fa-lg fa-envelope" aria-hidden="true"></i> 
 
       <br> 
 
       <a href="[email protected]">[email protected]</a> 
 
      </li> 
 
     </ul> 
 
    </div> 
 
    </body> 
 
</html>

+2

Je ne sais pas pourquoi vous ne pouvez pas? J'ai copié votre code et la marge fonctionne – StefanBob

+1

Y at-il d'autres CSS impliqués? – ZimSystem

+0

Aucun autre CSS n'est impliqué. J'ai l'impression que ça doit être quelque chose d'autre avec mon fichier HTML. Je suis vraiment perdu lol. – Mik3y

Répondre

1

Votre marge fonctionne. Vous voulez que votre h1 ne soit pas écrasé vers la gauche? Qu'en est-il horizontalement centré? (Je mets habituellement en bas de marge sur les en-têtes bien)

h1 { 
    margin: 0 0 10px 0; 
    text-align: center; 
} 
+0

Pour une raison quelconque, mon h1 ne bouge toujours pas du tout. Je n'ai aucune idée de ce que je fais mal. Y a-t-il quelque chose d'autre dans le HTML qui le gâche? – Mik3y

+2

Comment savoir, modifier votre réponse et publier votre code HTML complet – StefanBob

0

Assurez-vous que vous enregistrez le fichier, rafraîchir votre navigateur, effacer peut-être votre cache, fermez votre navigateur et rouvrez, faire la même chose pour votre éditeur de texte, etc. Votre code fonctionne. Assurez-vous que l'URL locale est correcte dans votre navigateur, etc., ou postez tout votre code. Essayez un navigateur différent. Il doit y avoir soit un élément qui n'a pas de balise fermée, un autre fichier CSS qui surcharge vos éléments h1, ou quelque chose que vous n'avez pas posté et qui est en conflit avec vos styles.