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
Michael Alder
2,230 PointsWhy is it when i refresh the page the highlighted target div does not go default again? The highlight stays there.
In the video the instructor "Guil" shows how to target an element with a target pseudo-class by clicking on a link with the Div id in it.. HTML: <li><a href="#s1">Target Section 1</a></li>
This is the CSS:
:target { color: white; background-color: blue; }
When he refreshes his page the highlight set up here disappears until he clicks it again or another one. On my page that link that was previously clicked remains highlighted or targeted even after refreshing. Whichever one you last clicked remains highlighted even after a page refresh. It however appears on the video that when he refreshed his page the highlight was then gone and page had no highlighted sections. Can someone help me figure out why mine will not go away on refresh.
2 Answers
Jason Anello
Courses Plus Student 94,610 PointsHi Michael,
When you click on one of these types of links as in this video you get something like index.html#s1
You should think of this url as a different url from index.html You can bookmark the url with the fragment identifier in the same way that you can bookmark "index.html" without the fragment identifier. It's the same page but the url with the hash # is identifying a specific part of that page.
When you refresh a page it should not change the url. It only reloads the contents of that url. This is why the highlight remains because a refresh should not be removing the #s1 from the url
The way you would get back to "index.html" is to use your browser's back button. This takes you back to the previous url that you were at.
So rather than think of it as resetting the page, I think you should think of it as different url's and your browser's "back" and "forward" buttons will take you back and forth through all the url's that you have visited.
Michael Alder
2,230 PointsNever mind I wasn't watching close enough. What he did was delete the Div id from the end of the address bar. That reset the page to where none of the divs were then selected. I still think there has to be a way that you can reset the page to where that highlight is gone by a way other than deleting part of the address bar.