I just completed my tribute page exercise for FCC. I wanted to get some feedback on if I am setting things up correctly.
I modified and added a box to place my photo in and one of my links is not working correctly. It’s a PDF for an online magazine. The code looks correct so I don’t know what I am missing.
Thanks, in advance for the feedback.
I took the pleasure of cleaning up your code.
This was a quick fix, but it will give you an idea what was done.
Just for the record, the pdf file does come out. It may look different in different browsers and systems, but it is viewable.
Take a look at it here, then ‘fork’ it over to your CodePen. (There is a tab that says “Fork”, use that and it will copy it to your site so that you may compare the two.
@ddiaz104 Thanks for taking a look.
I am comparing your clean up to my original to see what I missed and I to understand the changes.
- Did you use "XXX" to show the indentation? Under .navy-box two items do not have "xxx" should they be indented as well?
- In HTML I noticed you added "responsive" to the img. I understood this to work for an entire page such as making the page readable from a laptop to a mobile device. So it can be used for individual elements as well? I had used max-width 100px because I read that it was better for loading speeds and that images should load at the same size that they are uploaded. It makes sense to make the image responsive but how do you control the quality of the image from one device to the next?
Thanks for taking a look at the PDF. In my version the page comes up blank in Chrome but I didn’t test it in other browsers.
Thanks for looking at the page and giving some feedback.
The xxx was used to show that you do not need them.
As for the image-response;
“adding an .img-responsive class to the tag, the image will then scale nicely to the parent element.”
The “max-width 100px” is still there in the img tag. It makes it expand well withing the div.