Check out my Tribute page

Kindly assess my Tribute page, thanks https://codepen.io/adamuabu/full/RGoYLR/

HI

This code is not correct (boarder):

.jumbotron {
  background-color: #004010;
  margin: 20px;
  boarder-radius: 5px; <--- here
}

I think “First Prime Minister, Federal Republic of Nigeria” is a heading element:

<h1 class="text-center">Sir Abubakar Tafawa Balewa</h1>
        <p class="jumbp text-center"><em>First Prime Minister, Federal Republic of Nigeria</em></p>

https://www.w3.org/TR/html5/text-level-semantics.html#the-em-element

The placement of stress emphasis changes the meaning of the sentence. The element thus forms an integral part of the content.

Cheers and happy coding :slight_smile:

1 Like

This looks great!

The images look pretty good in their own column like that,but you might also experiment with making them floating elements so the text can wrap around at the bottom. (The offset gets a little awkward toward the bottom.) Bootstrap provides push-left and push-right for floating elements.

Also, I notice this:

h1 {
  color: #ffffff !important;
  font-size: 60px;
}

It’s best to avoid using !important as much as possible. The better alternative is to use a CSS selector with higher specificity than other rules. The way you do this is just be more specific with the css selector, so instead of just hi use .jumbotron h1 or even give it an id attribute and use the ID selector. All of these will help override previous CSS without using !important.

!important is supposed to be used to indicate “I never want anything more specific to override this later on” in a situation where very general CSS could get included by other code. Otherwise its better to be more specific to override less specific styles.

1 Like

Thanks a lot @Diego_Perez , corrected.

1 Like

Thank so much and noted @rjstone