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

CSS CSS Foundations Web Typography Web Fonts

Kalen Loncar
Kalen Loncar
8,743 Points
Posted by Kalen Loncar
Kalen Loncar
8,743 Points

Unicode confusion

Hello,

I am confused as to why in the video on web-fonts, Guil uses unicode '\e000' and '\e002' when linking the html 5 and css 3 icons. On the icomoon website, it says to use unicodes '\e600' and '\e601'. I tried using the icomoon unicodes, and nothing was rendered.

I am wondering where these values came from and also how I would have known to use those unicodes without watching the video, as they are different than what the website instructs.

Also, when inserting the generated content, he has it absolutely positioned 45% from the left size of the page, which leaves it dead center. Why is that 50% does not center it, but 45% does?

Thank you for reading/answering.

3 Answers

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Did you by chance use the codes from the website with the icon files that Guil provided with the project? I was playing around with the icomoon app and I was able to reset the code for the html5 icon to '\e700' (just a random number I picked). I could be wrong but I don't think the codes are permanent. I think that when you are creating your own custom icon font you can reset the codes to start at what you want.

Maybe that's what Guil did? He picked out the two icons that he wanted and reset the code to start at 0?

For positioning - If it was a background image then a background-position of 50% would center. However, this is a font and it's being absolutely positioned. 45% means position it's left edge 45% from the parent. If you used 50%, then the left edge of the icon would be in the center.

Tyler van der Hoeven
Tyler van der Hoeven
11,863 Points
Tyler van der Hoeven
Tyler van der Hoeven
11,863 Points

Haven't actually watched that video but I've faced unicode stuff a lot when using Sass. This entity conversion calculator is super helpful. http://www.evotech.net/articles/testjsentities.html

Kalen Loncar
Kalen Loncar
8,743 Points
Kalen Loncar
Kalen Loncar
8,743 Points

Thank you so much, I didn't realize I didn't download the unicodes but rather used the ones he provided. It is much clearer now!