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
Zachary Pratt
2,395 PointsContact and About Page
What caused my header colors to no longer appear? At the same time, my page high lights for (portfolio, about, contact) stop working. My picture on the about page is no longer centered? All of this happened at the same time. They were all correct before. I can't move forward until these issues have been resolved. Please help. I started learning html and css a month ago.
4 Answers
MUZ140920 Kudakwashe Murungu
6,316 PointsCan you edit your code .contact-info li.mail a { background-image: url('../img/mail.png'); align-content:
to
.contact-info li.mail a { background-image: url('../img/mail.png'); }
Save and test
Zachary Pratt
2,395 PointsYes. I did and it was the fix, for everything except centering my photo on the about page. GREAT! Thank you so very much sir.
MUZ140920 Kudakwashe Murungu
6,316 PointsNothing much can be done without previewing your code, Like @Victor has pointed out, post your code
Zachary Pratt
2,395 PointsI'm not sure what is meant by "using the markdowns". Should I copy and paste the code here?
Zachary Pratt
2,395 PointsI see the cheat sheet. Thanks
Zachary Pratt
2,395 Points/******************** GENERAL **********************/
body { font-family: 'Open Sans', sans-serif; }
wrapper {
max-width: 940px;
margin: 0 auto;
padding: 0 5%;
}
a { text-decoration: none; }
img { max-width: 100%; }
h3 { margin: 0 0 1em 0; }
/******************** HEADING **********************/
header { float: left; margin: 0 0 30px 0; padding: 5px 0 0 0; width: 100%; }
logo {
text-align: center;
margin: 0;
}
h1 { font-family: 'Changa One', sans-serif; margin: 15px 0; font-size: 1.75em; font-weight: normal; line-height: 0.8em; }
h2 { font-size: 0.75em margin: -5px 0 0; font-weight: normal; }
/******************** NAVIGATION **********************/
NAV { text-align: center; padding: 10px 0; margin: 20px 0 0; }
nav ul { list-style: none; margin: 0 10px; padding: 0; }
nav li { display: inline-block; }
nav a { font-weight: 800; padding: 15px 10px; }
/******************** FOOTER **********************/
footer { font-size: 0.75em; clear: both; text-align: center; padding-top: 50px; color: #ccc; }
.social-icon { width: 20px; height: 20px; margin: 0 5px; }
/******************** PAGE PORTFOLIO **********************/
gallery {
margin: 0;
padding: 0;
list-style: none;
}
gallery li {
float: left; width:45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7; }
gallery li a p {
margin: 0;
padding: 5%;
font-size: 0.75em;
color: #bdc3c7;
}
/******************** PAGE ABOUT **********************/
.profile-photo { display: inline-block; max-width: 150 px; margin: 0 auto 30px; border-radius: 100%; }
?******************** 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 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'); align-content:
.contact-info li.twitter a { background-image: url('../img/twitter.png'); }
/******************** COLORS **********************/
/* site body */ body { background-color: #fff; color: #999; }
/* green header */ header { background: #6ab47b; border-color: #599a68; }
/* nav background on mobile */ nav { background: #599a68; }
/* logo text */ h1, h2 { color: #fff; }
/* links */ nav { color: #6ab47b; }
/* nav link */ nav a,nav a:visited { color: #fff; }
/* selected nav link */ nav a.selected, nav a:hover { color: #32673f; }
MUZ140920 Kudakwashe Murungu
6,316 PointsMost welcome @Zachary Pratt im glad I could help
Victor Learned
6,976 PointsVictor Learned
6,976 PointsPlease post your code or it's impossible for us to help. Remember to use the markdowns correctly so it's all formatted & readable!