Help: Tribute Project

1

I am starting my first project, and am running into a few things that I thought should work.

  1. Changing the color of font in my title.
  2. Creating columns that are side by side.

Can you please look at my page and advise?

Thank you!

2

The columns do show up side by side for me.

As for the color, I think it’s a Bootstrap thing, but I’m not sure.

3

Thank you for taking a look. You are right, I am using my mac instead of my full monitor and the columns were pushed together.

4

If you remove the div with class=“jumbotron”, the color will work.

I believe the reason is that the Bootstrap framework overrules your color change. In bootstrap, jumbotron is set to inherit color. Although, I’m not sure from where it inherits it.

5

@dadleatherwood please check on my fork of your codepen.

If you change your css selector h1 to .jumbotron h1{ … } it becomes “more specific” and will overwrite the Bootstrap defaults.

With Bootstrap you will often find yourself “fighting” with their defaults / ideas of how things should be done. Bootstrap really isn’t easier… and you end up with html markup that is uglier than my step-sister, with a bunch of useless divs, and the css is bloated - you won’t use 99% of their 148kb stylesheet, which will make your site slower.

IMO as a teacher and developer, I would recommend you focus on pure CSS at the beginning of your learning curve, and then switch to SCSS as soon as possible. Forget Bootstrap… you can pick that up in a few hours once you have a strong foundation.

If you’re interested, try starting with this basic wireframe, and see if you can figure out the rest of the css.

Notice how much easier to read/understand the markup is and how the “reuseable” styles are separated into classes which can be applied to all future projects. I would argue that the code is easier to read, less complicated and more reusable on your next project.

Good developers create reusable code, that is easy to read/understand and as doesn’t contain anything extra.

FCC Tribute Page Project- Basic Starter Wireframe

1 Like
6

Thank you so much for the help. I changed it up a bit, and now have something new.

Would love to hear any advice.

Thank you!

1 Like
7

Looks great @dadleatherwood! You really got the right feel with your font choice. If you want a challenge, try getting the ‘Early Years’ and ‘Career’ photos beside the lists. You might find that sprinkling in a few short paragraphs of text balances out the page.

1 Like
8

Your page looks great!

1 Like
9

Stellar choice of fonts … fits perfectly

2 Likes