Hi Jonathan,

Can you post the code so we can see what you are doing?

/****************************************************** GENERAL ******************************************************/

body { font-family:'Open sans', sans-serif; }

wrapper {

max-width: 940px; margin:0 auto; padding: .05% 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; }

/****************************************************** NAV ******************************************************/ 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: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 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'); }

/****************************************************** 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/ a { color: #6ab47b; }

nav a, nav a:visited { color:#fff; }

/selected nav link/ nav a .selected, nav a:hover { color:#32673f; }

Elian Kloppenburg i don't know if you want to see my other codes? or the website link itself?

Elian Kloppenburg i don't know if you want to see my other codes? or the website link itself?

I can see your HTML but not your CSS. Maybe replace the HTML with CSS where you added the breakpoints.

@media screen and (min-width: 480px){ body { background:navy; } }

@media screen and (min-width:260px){ body{ background:darkgreen; }

}

i can send the longer my main.CSS where a lot of the codes are. cause the last code i sent was basically the breakpoints in my response.css Elian Kloppenburg

Are you sure your css file is named properly? You linked to responsive.css, Make sure the file is called exactly the same. Also make sure that the file is in the /css folder. See what happens if you link to this:

<link rel="stylesheet" href="responsive.css"> 

i copied and paste my main.css alone. or do you also want me to include the breakpoint code as well? i'm sorry if i'm not making everything clear

No problem, Jonathan. It's clear enough.

It looks to me like there is nothing wrong with your CSS.

So the problem is most likely in your link. See my comment above. Try to link to the proper file. And make sure your responsive.css file is in the css folder.

i just copied the code into it but now the no colors appear. instead of href="responsive.css" ... i actually put href="css/responsive.css">

i get the code to work when the latter code is placed in. the problem with that one is when i increase the window to see the colors change, nothing happens. i had some reason to believe it was because i made an error adjusting paddings and margins px's. but than again i thought it was cause it's not an official website yet but later it would get repaired. but this is my second time trying to do this track and still i get stuck

It took me a while but i see what is wrong now. Your original file was almost good. I changed one tiny thing. The last line need to be at 660px instead of 260px. Go back to where you were when you asked the question ad paste this code into your repsonsive.css file. It should work after that.

@media screen and (min-width: 480px){ 
    body { 
        background:navy; 
    } 
}

@media screen and (min-width: 660px){ 
    body { 
        background:darkgreen; 
    }
}

yes it works! any idea why it needed to be that px size instead of the original? i'm on a mac air

thank you so much for this help. now i can move on !!!! and also how did you send me that css code in that format? when i sent my html it automatically popped up as code but when i sent my css it popped up as text