Personal portfolio page, questions

I’m new to FCC and have completed the Map up to the Algorithm portion. I’m working on my personal page and have a few issues that I need help or explanation on what might be the issue.

See the Pen mmxyqG by Kane McGukin (@Oldirish) on CodePen.

  1. I can’t get the divider and </> on the same line
  2. When I use the Row class and Col’s it seems to format to a total of 10 cols and not 12. If I do 8 and 4 it pushes the 4 too far to the right, and I couldn’t get the margins or padding to change this.
    3.Same issue with the divider in Portfolio and contact.

Any help appreciated.

Hi @Oldirish,

I had a quick look at your codepen but I can’t quite make sense of what you are trying to achieve - visually.
Do you have an image of the layout you are trying to create?

The col classes seem to be working as expected when I set them to 8 and 4, though the image seems to be quite large (wide) for where it is positioned, which may be whats causing it to look like the css is rendering things too wide

For problem number one I would not use the hr element to achieve the effect you want. Make a div with and put the <> text inside of it centered and you will get the same look that I think you are going for.

Check this out. See if this is more like what you were trying to achieve.
note: i also changed your navbar to navbar-inverse because the hover state on your links didn’t show well.

codepen.io

Thanks Paul. I was trying to memic the example - https://codepen.io/FreeCodeCamp/full/YqLyXB/

I will update the size of the picture later tonight.

Thanks. I will add this tonight and see if I can get it to work.

Yes, much better. Thanks. I will play around with it again tonight.