1st Tribute - Looking for some Help

Looking for some general directions as to where to start with this tribute page…

I learned a few things going through the basic code camp “boot camp”. Now I’m trying to make my product better because my results are mediocre. Here’s his site: http://www.mpkeane.com/ – it is very aesthetically pleasing. If I could produce a scaled down version of this, I would be pleased. I am trying not to peek at the source code of the example for answers.

Any hints / directions as to where to start finding out how I can improve this?

I want a different image in the background, center the profile picture and then have a semi-translucent backdrop for the text. Forgive my lack of web-taxonomic terminology.

You’ve got some of the basics in place.

The text is pretty hard to read at the moment - I guess that’s why you want the semi-translucent backdrop.

To do a translucent bg-color, you can apply a css style to your text boxes and use rgba colours. For example background-color: rgba(255, 255, 255, 0.5);

The first three values are red, green and blue values, but the last one is the ‘alpha layer.’ The alpha layer is a value between 0-1 that defines the opacity of the colour.

To centre an img using Bootstrap, you usually use the center-block class on your image. But since yours is in a row and has a col-xs-4 already defined, center-block will just centre it within the 4-col div. To centre the col-4 div within the parent row, use col-xs-offset-4 as a second class in the div.

1 Like