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
Roy White
797 Pointscontact background img still showing up cut in half and not to the left of my contact anchors. How do I fix this?
.profile-photo { display: block; max-width: 150px; margin: 0 auto 30px; border-radius: 100%; }
.contact-info a { display: block; min-height: 20px; background-repeat: no-repeat; background-size: 20px 20x; padding: 0 0 0 30px; margin: 0 0 10px; }
.contact-info li.phone a { background-image: url('../img/phone.png'); } .contact-info li.mail a { background-image: url('../img/mail.png'); } .contact-info li.twitter a { background-image: url('../img/twitter.png'); }
2 Answers
millogt
7,644 PointsU missed out the p of px at the background-size property. (background-size: 20px 20x;)
This fixed it for me.
.contact-info a {
display: block;
min-height: 20px;
background-repeat: no-repeat;
background-size: 20px 20px; /* <------- here */
padding: 0 0 0 30px;
margin: 0 0 10px;
}
Try to paste your code in a nicer way next time as it is hard to read the way u did, check the Markdown Cheatsheet link underneath answer box. Good luck!
Roy White
797 PointsOh my goodness what a silly thing to overlook! Thank you so much Gert! By the way how do I paste my code like you did for future notice
millogt
7,644 PointsUnder the 'add an answer' window where u type in is a link u can click on called 'Markdown Cheatsheet'. U need to put your code between 3 backticks and u can add the kind of code (html, css,...) to help color coding.
Roy White
797 PointsRoy White
797 PointsHere is the section of CSS in regards to the contact. .contact-info a { display: block; min-height: 20px; background-repeat: no-repeat; background-size: 20px 20x; padding: 0 0 0 30px; margin: 0 0 10px; }
.contact-info li.phone a { background-image: url('../img/phone.png'); } .contact-info li.mail a { background-image: url('../img/mail.png'); } .contact-info li.twitter a { background-image: url('../img/twitter.png'); }