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

CSS CSS Foundations Advanced Selectors Substring Matching Attribute Selectors

Shariq Shaikh
Shariq Shaikh
13,945 Points
Posted by Shariq Shaikh
Shariq Shaikh
13,945 Points

Solved : Icons for the pdf and doc files not appearing upon browser refresh

I copied the code exactly and after I save and refresh the browser, the browser recognizes that something should appear in the area where the icons should be by moving the text over, but instead of showing the icons its just empty space instead.

Here's my code:body { padding: 0 22%; background-color: #e0eef5; color: #222; font: 1.1em/1.5 sans-serif; } ul { padding: 0; list-style-type: none; line-height: 2.5; } img { margin-right: 20px; }

/* Substring Matching Attribute Selectors */

a[href^="http://"] { color: seagreen;

}

a[href^="mailto:"] { color: white; background-color: tomato; padding: 4px 8px; text-decoratione: none;

}

a[href$=".pdf"] { background: url('../images/pdf.png) no-repeat 0 2px; padding-left: 25px; } a[href$=".doc"] { background: url('../images/doc.png) no-repeat 0 2px; padding-left: 25px; }

Shariq Shaikh
Shariq Shaikh
13,945 Points
Shariq Shaikh
Shariq Shaikh
13,945 Points

figure it out, typo in the rule

Alexander Folkenflik
Alexander Folkenflik
3,521 Points
Alexander Folkenflik
Alexander Folkenflik
3,521 Points

sorry, where was the typo? I'm having the same problem.

a[href$=".pdf"]{ background: url('../images/pdf.png') no-repeat: 0 2px; padding-left: 25px; }

a[href$=".doc"]{ background: url('../images/doc.png') no-repeat: 0 2px; padding-left: 25px; }