Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML How to Make a Website Adding Pages to a Website Add Iconography

Posted by Pamela Holland
Pamela Holland
2,642 Points

Icons not showing

I'm having trouble my removing my bullets and getting my contact icons to show for this lesson. Here's my code: .contact-info a { display: block; min-height: 20px; background-repeat: no-repeat; background-size: 20px 20px; padding: 0 0 0 30px; margin: 0 0 10px; }

.contact-info li.phone a { background-image: url('../img/phone.png'); }

what am I doing wrong? Thx, Pam

Pamela Holland
Pamela Holland
2,642 Points

Sorry, codepen cost $ and this all adds up. I will try and figure it out. Thanks for your replies. :-)

Tom Bedford
Tom Bedford
15,645 Points
Tom Bedford
Tom Bedford
15,645 Points

CodePen is free, unless you want private pens and some other features that I don't remember. You don't need to pay to make an account and share pens with other people.

4 Answers

Pamela Holland
Pamela Holland
2,642 Points
Pamela Holland
Pamela Holland
2,642 Points

Codepen still keeps asking for $$. Here's the code: <h3>Contact Details</h3> <ul class="contact-info"></ul> <li class="phone"><a href="tel:555-222-3333">555-222-3333</li> <li class="mail"><a href="mailto:nick@example.com"><a href="mailto">nick@example.com</a></li> <li class="twitter"><a href="http://twitter.com/intent/tweet?screen_name=nickrp">@nickrp</a></li> </section> <footer> <a href="http://twitter.com/nickrp"><img src="HowToMakeAWebsite-Stage3-Video2/img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="http://facebook.com/nickpettit"><img src="HowToMakeAWebsite-Stage3-Video2/img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>

Tom Bedford
Tom Bedford
15,645 Points
Tom Bedford
Tom Bedford
15,645 Points

CodePen Signup scroll to the bottom of the page, "free plan". It does seem more hidden than it used to be!

Alternatively, without needing an account - go here, enter your code, click save, copy the page URL from the top of your browser window and post it to the forum.

Tom Bedford
Tom Bedford
15,645 Points
Tom Bedford
Tom Bedford
15,645 Points

Hi Pamela

Could you put your full HTML and CSS into a CodePen? This will let other users see your code in action and give them a better chance at helping you.

Caroline Hagan
Caroline Hagan
12,612 Points
Caroline Hagan
Caroline Hagan
12,612 Points

Hi Pamela Holland Could you drop your code into a codepen ( codepen.io) so I can take a better look?