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

HTML

Posted by James Taylor
James Taylor
981 Points

Problem with pages for site.

Hello all,

I started followed along when doing the first step of the Web Design track and now that I am done I am trying to personalize the site a little bit. The problem I am having is that when I try to click my links it brings up the example layout instead of what I tried to edit it to. If someone can tell me how to post my code in here I would appreciate it so I can get my questions answered.

Thanks

Chyno Deluxe
Chyno Deluxe
16,936 Points

Please post your html code.

4 Answers

James Taylor
James Taylor
981 Points

I figured it out, it was something weird with my history. When I refreshed the page after clicking the link it fixed itself.

James Taylor
James Taylor
981 Points
James Taylor
James Taylor
981 Points

Index <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>James Taylor | Pitcher</title> <link rel="stylesheet" href="CSS/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="CSS/main.css"> <link rel="stylesheet" href="CSS/responsive.css"> <meta name="viewport" content="width=device-width, initial scale: 1.0"> </head> <body> <header> <a href="index.html" id="logo"> <img src="http://i.imgur.com/lmDQMhz.png" alt=""> <h1>James Taylor</h1> <h2>Pitcher - Lehigh Valley IronPigs</h2> </a> <nav> <ul> <li><a href="index.html" class="selected">Home</a></li> <li><a href="bio.html">Bio</a></li> <li><a href="archive.html">Archive</a></li> <li><a href="about.html">About</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <ul id="gallery"> <li> <a href="http://simulationsports.net/showthread.php?5229-Chasing-Dreams-A-MLBTS-RTTS-Chise&p=161938&viewfull=1#post161938"> <img src="https://farm8.staticflickr.com/7629/16743204066_f9c48709f0_z.jpg" alt=""> <p>Taylor Gets First Win In Controversial Game.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="https://farm9.staticflickr.com/8684/16148478703_9a19246e2e_z.jpg" alt=""> <p>Injuries Force Taylor to AAA.</p> </a> </li> <li> <a href=""> <img src="https://farm9.staticflickr.com/8618/16711063046_7cf8824336_z.jpg" alt=""> <p>Taylor Gets No Decision.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="https://farm9.staticflickr.com/8581/16726222711_253305cba5_z.jpg" alt=""> <p>Taylor Gets First Complete Game.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="https://farm9.staticflickr.com/8565/16512393480_47b4d923dc_z.jpg" alt=""> <p>Taylor Finds A Gem.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="https://farm9.staticflickr.com/8673/16076608624_d74d127f4c_z.jpg" alt=""> <p>Woes Continue.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="http://facebook.com"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a> <p>© 2015 James Taylor.</p> </footer> </div> </body> </html>

Page that doesn't work <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>James Taylor | Pitcher</title> <link rel="stylesheet" href="CSS/normalize.css"> <link href='http://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400italic,700italic,400,700,800' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="CSS/main.css"> <link rel="stylesheet" href="CSS/responsive.css"> <meta name="viewport" content="width=device-width, initial scale: 1.0"> </head> <body> <header> <a href="index.html" id="logo"> <img src="http://i.imgur.com/lmDQMhz.png" alt=""> <h1>James Taylor</h1> <h2>Pitcher - Lehigh Valley IronPigs</h2> </a> <nav> <ul> <li><a href="index.html">Home</a></li> <li><a href="bio.html">Bio</a></li> <li><a href="archive.html">Archive</a></li> <li><a href="about.html" class="selected">About</a></li> </ul> </nav> </header> <div id="wrapper"> <section id="primary"> <h3>General Information</h3> <p>I am not currently looking for new design work, but I am available for speaking gigs and similar engagements. If you ahve questions, please don't hesitate to contact me!</p> <p>Please only use phone contac for urget inquiries. Otherwise, Twitter and email are the best way to reach me.</p> </section> <section id="secondary"> <h3>Contact Details</h3> <ul class="contact-info"> <li class="phone"><a href="tel:555-6425">555-6425</a></li> <li class="mail"><a href="mailto:nick@example.com">Nick@example.com</a></li> <li class="twitter"><a href="http://twitter.com/intent/tweet?screen_name=nickrp">@nickrp</a></li> </ul> </section> <footer> <a href="http://twitter.com"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="http://facebook.com"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a> <p>© 2015 James Taylor.</p> </footer> </div> </body> </html>

CSS /****************************** 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: 'Open Sans', 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; }

header img { display: block; margin: auto; height: 5em; width: 5em; }

/****************************** 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: HOME ******************************/

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 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: #002D62; border-color: #C80F2E; }

/* nav background on mobile */ nav { background: #002D62; }

/* logo text */ h1, h2 { color: #fff; }

/* link */ a { color: #C80F2E; }

/* nav link */ nav a, nav a:visited { color: #fff; }

/* selected nav link */ nav a.selected, nav a:hover { color: #C80F2E; }

James Taylor
James Taylor
981 Points
James Taylor
James Taylor
981 Points

Thanks for any help. If there is a better way to format the CSS in the forums please let me know.

James Taylor
James Taylor
981 Points
James Taylor
James Taylor
981 Points

Also I am using the preview window in workspaces could that be any part of the problem, maybe it reverts back to what it used to be.

I don't know if these work but here is the link to my preview via workspace http://port-80-jod3nc71nc.treehouse-app.com/index.html