CSS Treehouse Club: CSS My First Web Page Color Keywords, Hex Colors, and Font Families

George Kadar
George Kadar
2,721 Points

Why can't I see the hex colour when I hover the curser over it? Not too big of deal but I'd still like to know. Thanks

Yeah, so nothing happens with I hover the mouse over the code for the hex colour. Thanks in advance.

Grace Kelly
Grace Kelly
33,978 Points

Hi George could you post your code please??

George Kadar
George Kadar
2,721 Points

Hi Grace. Sorry, I'm not too sure what you mean by that. I'm like, super new to all of this. I've been using the code that's already in Workspace when you open it? Hope that helps.

Grace Kelly
Grace Kelly
33,978 Points

No worries George!! You can simple copy and paste your code into the input box and post it. You can reference the Markdown Cheatsheet at the bottom of the box where you type on how to format the code :) Alternatively you can take a snapshot of your workspace (there's a little icon on the top right hand side of the workspace your'e in) and then copy and paste the link here

George Kadar
George Kadar
2,721 Points
/***********************************************
Top bar color 
***********************************************/

html {
  background-color: #F8F8FF;
    border-top: 20px solid #8A85A5;
}



/***********************************************
Body styling 
***********************************************/

body {
    max-width: 600px;
    margin: 0 auto;
    padding: 50px 100px;
    font-size: 1.3em;
    line-height: 1.6em;
  font-family: 'Open Sans', sans-serif;
    color: #777;
    font-weight: 300;
}



/***********************************************
Image styling 
***********************************************/

img {
    border-radius: 20%;
    max-width: 340px;
}



/***********************************************
Headline styling 
***********************************************/
h1 {
    font-size: 1.5em;
    line-height: .5em;
    color: #DDA0DD;
}

h2 {
    font-size: 1em;
    line-height: 1em;
    font-style: oblique;
    color: #DDA0DD;

}

h3 {
    font-size: .875em;
    line-height: 1em;
    font-weight: normal;
}

h4 {
    margin-top: 60px;
    font-weight: 500;
  color: #696969;
}
George Kadar
George Kadar
2,721 Points

Does this help, Grace?

Grace Kelly
Grace Kelly
33,978 Points

That's great George, I copied your code into my workspaces and I can't see any issues when I hover over the hex color values...the issue might be as simple as needing to close and re-open workspaces :s haha

George Kadar
George Kadar
2,721 Points

Thank you, Grace. I'll start a new page and see if that works :-)

George Kadar
George Kadar
2,721 Points

Hi Grace. Figured out what the issue is. Firefox! Won't let me view the colour in Firefox so I'm going to start using Chrome for Workspaces and editing.

2 Answers

I have a similar issue; I'm using Firefox and I can't see the colors either. Annoying, that.

Petrius Balbinot
Petrius Balbinot
1,805 Points

Same issue: I am using Chrome, and all colors show as gray,