Feedback for @tenaciously's portfolio page

Code Feedback
1

Hello everybody,

I would very much appreciate any constructive feedback/suggestions you have to offer for my portfolio page

It’s a work in progress; I am going to give it a rest for a while, and proceed with the next part of the FCC front-end course work.

I admit currently it looks a bit… plain. Probably could do with a bit more color.

I will revisit and update the profile page with projects I’ve completed, and when I get light-bulb moments / good suggestions on improving my portfolio page.

Thanks in advance for your advice! Will definitely return the favour if anyone needs feedback for their portfolio page too!

2

So I just viewed my portfolio page from my Nexus 5X, and it looks like the footer is taking quite a bit of screen estate for my liking.

Any advice on how I could tackle that would be greatly appreciated.

Ta!

3

It looks good! I find that using less color is often better than too much, so I wouldn’t worry about how it looks until you have more in your portfolio. For the footer, you’ve got some empty divs with class col-xs-5, and I imagine that’s a hack to center the social icons in the footer. The problem is, those icons can shift around, and they do that when the footer gets too narrow. The only place they have to go is up, so you get increased height in your footer. I fixed it by

  1. Deleting the divs with class col-xs-5
  2. Changing the icon wrapper div to class col-xs-6
  3. Adding the class col-xs-offset-3 to the icon wrapper.

Now the icons don’t float around. You’ll want to do something similar to the text below those icons to make it centered beneath them.

4

Ta @PortableStick for the suggestions!
It didn’t quite work for me either; the footer icons were still not centered correctly in a mobile device (although the icons don’t all align horizontally using your suggestions)

In the end, the following changes work:

<div class="col-xs-12">
  <div class="text-center">
    <!-- icons here -->
  </div>
</div>

The reason why the above worked was that the icons are actually inside inline elements, so the text-center class works with the icons (I mistakenly thought the icons were block elements, hence using center-block class didn’t work)

Ta again for your help nonetheless!