html - my responsive site does not respond when I make the screen bigger -
i want create website responsive it's not responding min-height changes want. want alter colors when reachers breakingpoint can analyze css , html , see wha's wrong.
thanks,
css:
@media screen , (min-width: 480px) { body {background: navy; } } @media screen , (min-width: 660px;) { body { background: darkgreen;} } html:
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>dalexis peguero | designer </title> <link rel="stylesheet" href="normalize.css"> <link href='http://fonts.googleapis.com/css?family=changa+one|open+sans:400italic,700italic,800italic,400,700' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="main.css"> <link rel="stylesheet' href="responsive.css"> </head> <body> <header> <a href="index.html" id="logo"> <h1>dalexis peguero</h1> <h2>designer</h2> </a> <nav> <ul> <li><a href="index.html">portfolio</a></li> <li><a href="about.html" >about</a></li> <li><a href="contact.html" class="selected">contact</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <h3>general information</h3> <p>i not looking new design work, available when sense confident skills. </p> <p>please reach me email or facebook when it's not emergency, if need urgent consultation phone call me.</p> </section> <section> <h3> contact details </h3> <ul class="contact-info"> <li class="phone"><a href="tel:555-5555">555-5555</a></li> <li class="mail"><a href="mailto:dalexispeguero@gmail.com">dalexispeguero@gmail.com</a></li> <li class="twitter"><a href="http://twitter.com/intent/tweet?screen_name=nickrp">@dpeguero</a></li> </ul> </section> <footer> <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="twitter logo" class="social-icon"></a> <a href="http://facebook.com/dalexisp"><img src="img/facebook-wrap.png" alt="facebook logo" class="social-icon"></a> <p>© 2014 dalexis peguero. </p> </footer> </div> </body> </html>
this might problem:
<link rel="stylesheet' href="responsive.css"> you not closing quote in rel, alter this:
<link rel="stylesheet" href="responsive.css"> with not closed, not load resposive.css file
plus have wrong semicolon here:
@media screen , (min-width: 660px;) remove it, should this:
@media screen , (min-width: 660px) html css
No comments:
Post a Comment