About my Tribute page

Team,

I have started on my tribute project and using bootstrap classes. Thus far i completed header elements and an image and its caption. I am using class=“text-center” to my

and

elements and class=“img-responsive” to the image and however the content so far is aligned on left and NOT in center. I am not sure why the h1,h2 and images are not in the center.

Please help!

You need to make a css class called “text-center”

like this:
.text-center{ text-align: center; }
Put that in your css, everything should be centered now except for the image.
Then, surround the image in a div and assign that div the class “text-center”

Like this:
<div class="text-center"><img class="img-responsive" src="http://static.ibnlive.in.com/ibnlive/pix/ibnhome/gandhiearly23.jpg" alt="gandhiQuote"></div>

And you should be set!

@tormundgiantsbane - Thank you for the response.

I am using Bootstrap classes and have added that to my settings.

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css

text-center is one of the bootstrap class and that is not working for me.

ok, sorry didn’t know that. From what I see though, you haven’t added bootstrap on your codepen, All you have to do is click on the settings icon next to css, and go down to quick-add, and select bootstrap. When I opened your codepen I didn’t see it in your css settings, but when I added it everything except for the image was centered.

Thank you @P1xt, @tormundgiantsbane. I see the problem.

I have added Bootstrap lib to Javascript and now i added it to CSS section of codepen. That resolved the issue.
Thanks!

2 Likes