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 trialSam Weeks
Front End Web Development Techdegree Student 16,699 PointsSubstring selectors not working to load icons...
any one know where i may be going wrong... any help much appreciated. Thanks You :)
1 Answer
KRIS NIKOLAISEN
54,971 Points1) You are missing a colon between background-size
and 18px 18px.
2) You will want to use href$
instead of href^
for the extension since it comes at the end when setting the image
a[href^="http:"] {
color: #52bab3;
text-decoration: none;
background-repeat: no-repeat;
background-size: 18px 18px;
padding-left: 25px;
}
a[href$=".pdf"] {
background-image: url('../img/icn-pdf.svg');
}
a[href$=".jpg"] {
background-image: url('../img/icn-picture.svg');
}
a[href$=".zip"] {
background-image: url('../img/icn-zip.svg');
}
Sam Weeks
Front End Web Development Techdegree Student 16,699 PointsThank you I did figure it out in the end It was the semi-colon that was the major issue, thought I was going mental . Thank you KRIS NIKOLAISEN for the quick response and help though much appreciated :).
Peter Huang
5,427 Pointsthank god for this. I was wondering why mine didnt show up and after copy and paste this, it works and I've missed a typo too.
Sam Weeks
Front End Web Development Techdegree Student 16,699 PointsSam Weeks
Front End Web Development Techdegree Student 16,699 Pointsa[href^="http:"] { color: #52bab3; text-decoration: none; background-repeat:no-repeat; background-size 18px 18px; padding-left: 25px;
}
a[href$=".pdf"] { background-image: url('../img/icn-pdf.svg'); }
a[href^=".jpg"] { background-image: url('../img/icn-picture.svg'); } a[href^=".zip"] { background-image: url('../img/icn-zip.svg'); }