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 trialRachel Potgieter
11,814 PointsLinks in my 'about' and 'contact' pages still taking on the default color of blue?
HI. I was just curious to know if I missed a step because I see that in Nicks video, his links appear to be styled with a color whereas mine are defaulted. I have checked my main.css file and I see the links (contact, mail, tweet) have not been given any color values. Did I miss a step?
4 Answers
Henrik Christensen
Python Web Development Techdegree Student 38,322 PointsHere is the code from workspace:
/* links */
a {
color: #6ab47b;
}
/* nav link */
nav a, nav a:visited {
color: #fff;
}
/* selected nav link */
nav a.selected, nav a:hover {
color: #32673f;
}
and it seems like you are missing:
/* links */
a {
color: #6ab47b;
}
Because you don't have this code your link will be default-colored :-)
I hope this will help you :-)
Henrik Christensen
Python Web Development Techdegree Student 38,322 PointsTry post your code ;-)
V. T van der Vlugt
14,883 PointsYou can style links by
a {
color: #fff;
}
//unvisited links
a:link {
color: #333;
}
you can change the colour of links when they are hover or if they are visited etc. check pseudo classes of MDN which explains this far better than I can.
Hope this helps!
Rachel Potgieter
11,814 PointsThanks V. T. I have sorted the problem out. Seems I left out some code ;-)
Rachel Potgieter
11,814 PointsGENERAL
*******************************/
body {
font-family: 'Open Sans', sans-serif;
}
a {
text-decoration: none;
}
#wrapper {
max-width: 940px;
margin: 0 auto;
padding: 0 5%;
}
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 */
#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;
text-align: center;
clear: both;
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: block;
max-width: 150px;
margin: 0 auto 30px;
border-radius: 20%;
}
/*******************************
PAGE: CONTACT
*******************************/
.contact-info {
list-style: none;
margin: 0;
padding: 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');
}
.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 link */
nav a, nav a:visited {
color: #fff;
}
h1, h2 {
color: #fff;
}
/* Nav background on mobile */
nav {
background: #599a68;
}
/* Selected nav link */
nav a.selected, nav a:hover {
color: #32673f;
}```
Rachel Potgieter
11,814 PointsRachel Potgieter
11,814 PointsThanks Hendrick. You are a legend! Must have forgot to add it earlier.