I am doing the basic front-end Development Project-Build a Tribute Page, I followed the step to work it in CodePen, and configure the bootstrap as the CSS library. In this case, you need to fill a image in the page, my image has a very large size so I used the bootstrap class “img-responsive”(what I Learned from FCC lesson before) to make my image to fit to my browser view(or called the CodePen preview view), but it is useless, nothing to fit. Then I tried other bootstrap classes such as “text-primary” on my h tag, it’s ok. So I don’t know what’s wrong about it?
this is my code in CodePen html panel:
<h3 class="text-primary">The Greatest Man in china</h3>
<h4>Chief Ze Dong Mao</h4>
<img class="img-responsive" src="http://image18.poco.cn/mypoco/myphoto/20170403/16/18551742020170403165340040.jpg?2048x1454_120" alt="毛泽东在延安" />
<small>Chief Ze Dong Mao in xxxx
<small>copyright by Ivan Gao 2017</small>
Hope any one help me, thanks!
Are you sure you’re not using Bootstrap 4? It seems it doesn’t have any
I configure the CodePen default Bootstrap - “https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css”, I thought it before and I configured the Bootstrap 3.1 - “http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css” as a test, but it still useless, so I don’t know what’s wrong about it, my syntax error or editor error or Bootstrap version error?
Could you post a link to your codepen?
How about using this:
yeah, it’s wonderful! thansk a ton. But one more question, why it’s ok in bootstrap 3.3.7 not 3.3.1(FCC lesson used it and img-responsive still ok)?
The link you posted is blocked because it’s not https.
I tried replacing
https and it seems to work as well.
I had this problem. It changed to img-fluid for bootstrap 4. Beats me why they had to change the names. There are several name changes at version 4.
yes, you are right, I need to study to find the point on my browser console first, then I used the bootstrap 3.3.1 link(from FCC lesson) with https，it’s also ok. Whatever, thank you so much!
It beat me 2~~ I don’t know why they do that, but I used the class you told me and it’s ok, great, now I get two ways to solve this problem, thank you:smiley:
Thanks so much for posting this! I was completely unable to figure out what I was doing wrong. This link fixed everything. Just wanted you to know how much I appreciated your answering this question so I could someday search and find what I needed.
Wooow!! thx!. i just start my Tribute Page and just went through the same problem. This link fixed it