Thank you for the response now I have new problems 
The ul element (list) appear too much at right in smartphones screens
I want to put margins at the blue-light background but I dont know how do it, I tried body-background and the propierties margin-top, margin-right, margin-bottom and margin-left, (actually I have deleted then because dont work).
Other thing is that my elements and dont appear at left but the code is the same that I have used in
element and in this element work well.
My code is this
<div class="container-fluid">
<div class="text-center">
<div class="responsive">
<style type="text/css">
A:link, A:visited { text-decoration: none;}
body {width:100%; font-family: "Aref Ruqaa"; font-size: 22px; text-align: center;}
.smaller-image{
width: 500px;
}
h3 {
font-family: Lobster, Monospace;
font-size: 25px;
}
.thick-green-border {
border-color: #2998E4;
border-width: 5px;
border-style: solid; background: #b0c6f8; padding-top: 3px; padding-bottom: 10px; border-radius: 10px;}
.p-margin {margin-bottom: 75px;}
.p-sign {font-family: Arial; font-size: 15px; margin-bottom: 50px}
h4 {font-family:"Aref Ruqaa";font-size: 25px; color: black;}
h5 {font-family:"Aref Ruqaa";font-size: 25px; color: black;}
h6 {font-family:"Aref Ruqaa";font-size: 25px; color: black;}
ul {margin: 25px; margin-left: 280px; font-family: Arial; font-size: 17px; color: black;}
.font-style {font-family: Arial; font-size: 17px; color: black;}
h1 {color: white;}
.buttons{font-size: 20px;}
container{
text-align:center;}
a{font-family:Arial;
font-size: 16px;}
A:link, A:visited { text-decoration: none;}
.class1 {font-family: Arial; font-size: 17px; color: black;}
</style>
<head>
<link href="https://fonts.googleapis.com/css?family=Aref Ruqaa" rel="stylesheet" type="text/css">
<div class=container>
<h1 class=thick-green-border><b> John Ronald Reuel Tolkien</b></h1>
<h2> 1892-1973 </h2>
<img class="smaller-image" src="https://ichef-1.bbci.co.uk/news/660/cpsprodpb/14364/production/_96288728_tolk1.jpg" class="img-responsive" alt= "Tolkien">
<h3 class="responsive">Father of the modern medieval fantasy books. Tolkien was the creator of a world full of magic and all kind of creatures like dragons and elves.</h3
</head>
<body>
<body style="background-color: #ebf5fb;">
<div class="responsive">
<div class="container-fluid container">
<a href="#one"><button class="buttons btn btn-primary">Biography</button>
<a href="#two"><button class="buttons btn btn-primary">Bibliography</button>
<a href="#three"><button class="buttons btn btn-primary">Links</button>
<h4 class="thick-green-border">
Biography </h4>
<p id="one" align="left" class="font-style">Tolkien was born in Sout Africa, son of a banker and a missionary. In 1895 he moved with his mother Mabel Suffield und his brother Hilary to England. His father Arthur Reuel Tolkien stayed in south africa but he died in 1896.</p>
<p class="font-style" align="left" >After the loss of her husband, And without income Mabel moved with her children to Sarehole. The English countryside was very inspiring for Tolkien's work as we see in his books. </p>
<p class ="font-style" align="left" >Mabel was in charge of the education of John and taught him Latin. From the age of four, one of Jhon's favorite hobbys was to create his own languages.</p>
<p class ="font-style" align="left" >In 1904, when John was 12 years old, his mother died, the pastor Xavier Morgan looked after then of Jhon and his brother Hilary.</P>
<p class ="font-style" align="left" >When he was 19, traveled to the Alps, a place that inspired him to describe Bilbo's journey through the Misty Mountains, in "The Hobbit".</p>
<p class ="font-style" align="left" >At 23 years he married with Edith Mary Bratt, a girl he had met years ago at the orphanage.</p>
<p class ="font-style" align="left" >In 1914 he wrote the poem "The Voyage of Éarendel the Evening Star", which many consider the genesis of his work. That year began the First World War which would interrupt his peaceful life.</p>
<p class ="font-style" align="left" >In 1915 John graduated in Oxford with a honorable mention in "Literature and English Language", soon after graduating, he enlisted in the army as a communications officer. The First World War, was a tragedy unprecedented for all the countries. In the war, Jhon lost his friends Robert Q. Gilson and G.B.Smith.</p>
<p class ="font-style" align="left"> On October 27 of 1916, John became ill ,on 8 November was transferred to England. After returning to his country he began working on the writing of the Oxford English Dictionary, until 1920 when he got a job as a non-English teacher at the University of Leeds,he soon obtained the post of professor. Jhon worked most of his life for the University of Oxford, although he also worked for other universities in jobs related to the English language. </p>
<p class ="font-style" align="left"> In his spare time, John was with his family and wrote. He wrote stories and legends that years later became in "The Silmarillion", for him it was a way to compensate that England did not have its own mythology.
</p>
<p class ="font-style" align="left">In 1926 he met C.S. Lewis, another college professor who like him was fascinated by fantastic literature</p>
<p class ="font-style" align="left"> Jhon had four children and began writing "The Hobbit" for them. He thought his stories would not interest the public, but his friend C.S. Lewis encouraged him to publish them. The story was published in 1937, and was a great success that surprised Tolkien, then his editor asked him to write a sequel and in this way John began to write his masterpiece "The Lord of the rings". It took twelve years to write this great work and because of its volume was divided into three parts: "The fellowship of the ring", “The two towers” (1954) and “The Return of the King” (1955).</p>
<p class ="font-style" align="left"> While working on the writing of Lord of the Rings, he wrote other stories like 'Leaf, by Niggle', 'Egidio, Ham's Farmer' and at his aunt's request "" The adventures of Tom Bombadil and other poems Of the Red Book '(a compilation of 16 poems). Before dying he wrote three more histories: "Three and Leaf", the poem "Mitopeia" and "The blacksmith of Wootton Mayor"</p>
<p class ="font-style" align="left">John retired in 1959 and in 1968 moved with Edith to Bournemouth, looking for more privacy. In In 1971 Judith died and John wrote on his tombstone the word "Lúthien". Jhon died in 1973 and both are buried in Oxford's Wovercote Cemetery. A year and a half before her death, Queen Elizabeth II appointed him "Commander of the Order of the British Empire" and Oxford University appointed him "Doctor Honoris Causa in Letters"</p>
<h5 class="thick-green-border">
Bibliography</h5>
<p1 id="two" align="left" class="font-style">Throughout his life Tolkien wrote many works and different styles. Below you can see a list with the most important.</p>
<ul><li>1937 "The Hobbit"</li><li>1945 "Leaf by Niggle"</li><li>1945 "The Lay of Aotrou and Itroun"</li><li>1949 "Farmer Giles of Ham"</li><li>1953 "The Homecoming of Beorhtnoth Beorhthelm's Son"</li><li> 1954 "The Lord of the Rings"</li><li>1962 "The Adventures of Tom Bombadil"</li> <li>1964 "Tree and Leaf"</li><li>1966 "The Tolkien Reader"</li><li>1967 "The Road Goes Ever On"<li>1967 "Smith of Wootton Major"</li> </ul>
<h6 class="thick-green-border">Links</h6>
<p2 id="three" class="font-style">If you want to read more about his biography visit <a href="https://en.wikipedia.org/wiki/J._R._R._Tolkien">this link</a></p2>
<p class="p-margin font-style">If you want to know all his bibliography visit <a href="https://en.wikipedia.org/wiki/J._R._R._Tolkien_bibliography">this link</a></p>
<p class="p-sign">Written and code by Verónica Almeneiro</p>
</div>
</div>
</div>
</div>
</body>
And this is my code pen until now
Thank you for reading!
, I have post the code ten minutes ago and the result was…
…horrible. Sorry for my few experience using this web.
, one question when you say “formatting your code and commenting”, that mean that I must write the code here in the post?.