Help with Portfolio adding icons

I am having trouble with my ‘Around the web’ section. I want ‘Around the web’ to be to the right of the comment section. I am also not sure why there is a dark blue box beneath the ‘Around the web’ and why the social media icons are not showing up. Please help!

You haven’t put the section in the same row. At least that how it looks — I suggest you indent your code consistently, so the structure will be easier to see.

If you use the browser’s inspector tool, you’ll see the blue band is your social list and the color is coming from ul. The icons aren’t there because you haven’t loaded the font, so the tags are meaningless and nothing is displayed.

Thank you! How can I use the inspector tool? And how do I load the font?

Look it up, it depends on the browser. I forgot if fcc mentions it.

you’re trying to use font awesome. Include it like you do bootstrap.

1 Like

Press F12 on Firefox and Chrome to access dev tools.

To import a font, you may place this in your css file

@font-face {
    font-family: "faith";
    src: url("/yourfontpath") format("truetype");
}

Or you may import it from a distant server, example with a google font

<style>
@import url('https://fonts.googleapis.com/css?family=Open+Sans');
</style>

Then don’t forget to declare it. Example

f`ont-family: ‘Open Sans’, sans-serif;

1 Like