Need help with <tribute page>

Need help with <tribute page>
0.0 0

#1

Hello!!! I’m struggling with my tribute page for 2 days in a row, just can’t figure out how to use col-xs/col-md classes! I tried all possible options, just don’t get it! I want to center position of img and list, how to do that? and why css color body dont work?


#2

You can add the classes “center-block” and “text-center” to the first div that has the row class and then add the class “text-left” to the div that has all the description, or you can do your own custom css and change the properties display, margin, text-align.

Search for “css centering” on Google for more info :slight_smile:

  <html lang="en">
  <head>
    <title>Yuri Gagarin</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  </head>
  <body>

  <div class="container">
    <div class="row center-block text-center">
    <h1>Yuri Gagarin<p><em>First Man In Space</em></p> </h1>
        <div class="col-md-#">
        <img class="img-rounded" src="http://www.voxkomm.info/wp-content/uploads/2013/04/yuri_gagarin_first_cosmonaut_ussr_80_years_old_93412_1440x900.jpg" alt="Yuri Gagarin">
          <h4 class="text-center">Here's a timeline of his life</h4>
       <div class="list text-left">
          <ul>
        <li>09 March 1934		Yuri Alexeyevich Gagarin is born</li>
        <li>Spring 1941		World War II - German invasion of the USSR begins</li>
        <li>14 March 1955		First Parachute Jump</li>
        <li>1955		Gagarin graduates from Saratov Industrial Technical School</li>
        <li>July 1955		First Solo Flight in YAK 18</li>
        <li>November 1955		Gagarin makes the rank of Cadet</li>
        <li>26 March 1957		First Solo Flight in MiG-15 jet</li>
        <li>06 November 1957		Gagarin graduates from the Voroshilov 1st Chkalovsk Military Aviation School</li>
        <li>10 April 1959		First child, Elena, born</li>
        <li>05 October 1959		Gagarin Submitted request for cosmonaut training (unconfirmed)</li>
        <li>06 November 1959		Gagarin receives the rank of First Lieutenant</li>
        <li>11 January 1960		Gagarin is approved for cosmonaut training</li>
        <li>07 March 1961		Second child Galya Born</li>
        <li>10 April 1961		Gagarin confirmed for launch on 12/04/61</li>
        <li>12 April 1961		YURI ALEXEYEVICH GAGARIN <u>ORBITS THE EARTH</u> IN THE VOSTOK-1 CAPSULE</li>
        <li>21 April 1961		Gagarin on the cover of Time Magazine</li>
        <li>05 January 1963		Hospital for an appendix operation</li>
        <li>06 November 1963		Received the rank of COLONEL (ahead of schedule)</li>
        <li>1963		Named Commander of the Cosmonaut Group</li>
        <li>17 February 1968		Graduated with Honors as Cosmonaut Engineer</li>
        <li>27 March 1968		Final flight</li>
        <li>27 March 1968		Colonel Yuri Gagarin's MiG15UTI crashed, killing Gagarin and his instructor, Colonel Vladimir Seryogin</li>
      </ul>

        </div>
    </div>
    </div>
  </body>
  </html>

#3

thanks, and why css color for body dont work?


#4

Try hex colours or try using “gray”.


#5

still don’t work, no idea why


#6

Just use one. I see that you are using multiple color and background-color elements.


#7

I used all possible options, didnt work! something blocks this css rule! now there is only one background option:slight_smile:

finally got a solution

< body style=“background-color:#cbcbb3


#8

Use external style sheets. Never use style tags in html.