Social Network Icons visible on dreamweaver but not browser?

[ak5592kif]

I'm working on a website: http://www.chictreatz.com

The problem I have is that the social network icons for my site do not display in web browsers. The URL for the social networks are there because I can move my cursor over the position where the icons are suppose to be and click them, but the icons are invisible. I can't figure it out. Anybody else have this problem?

This is my social networks code:

<!-- Icons -->

  <ul class="icons">

  <li><a href="http://www.facebook.com/chictreatz.chictreatz" target="_blank"><i class="fa fa-facebook" aria-hidden="true"></i></a>

  <li><a href="http://www.instagram.com/chictreatz" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i></a>

  </ul>

[osgood_]

The link to your font awesome css stylesheet points to your local machine:

@import url("file:///Macintosh HD/Users/Keef/Downloads/221-fall2016/html5up-big-picture/assets/css/font-awesome.min.css");

As do quite  a lot of other links, backgrounds etc:

.image:before {

content: '';

position: absolute;

left: 0;

top: 0;

width: 100%;

height: 100%;

background: url("file:///Macintosh HD/Users/Keef/Downloads/221-fall2016/html5up-big-picture/assets/css/images/overlay.png");

}

You need to go through your css stylesheet and make sure the links are correct. Did you define a site root folder at the outset of your project?

[Nancy OShea]

Font Awesome is hosted on Max CDN.  Use the CSS link shown below and your icons will appear.

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">

[ak5592kif]

Thank you, Nancy! That resolved the issue instantly!

[osgood_]

ak5592kif  wrote

Thank you, Nancy! That resolved the issue instantly!

Rather than papering over the cracks you need to fix them.