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 trialCori Bowen
6,956 PointsCSS styling is not affecting my list items. I cannot get the bullets to go away or the icons to show up. Help!
I've read through the questions that other people have had regarding this but I cannot fix my problem. My code appears right to me, and I've tried clearing my browser and cache but nothing has happened.
here is my html:
<section> <h3>Contact Details</h3> <ul class="contact-info"></ul> <li class="phone"><a href="tel:800-715-9870">800-715-9870</a></li> <li class="mail"><a href="mailto:cori@exmaple.com">cori@exapmle.com</a></li> <li class="twitter"><a href="http://twitter.com/intent/tweet?screen_name=SewLaMode">@SewLaMode</a></li> </section> <footer>
and my css:
/************************* Page: Contact *************************/
.contact-info { list-style: none; padding: 0; margin: 0; font-size: 0.9em; }
.contact-info a { display:block; min-height: 20px; background-repeat: no-repeat; background-size: 20px 20px; padding: 0 0 30px; }
.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'); }
thanks
2 Answers
Rick Gessner
43 PointsCori -- Your bullets are not showing up because your CSS has an error. .contact-info should read: {list-style-type:none; padding:0; margin:0; font-size:0.9em;}
The icon issue is likely 1) a path issue; 2) a positioning issue; 3) a size issue; Start by seeing if you can load one of your .png files into your webpage using a simple tag to confirm the path and worth up from there.
Cori Bowen
6,956 PointsThnaks so much!