Skip to content

Instantly share code, notes, and snippets.

@gavinblair
Created October 20, 2010 17:09
Show Gist options
  • Save gavinblair/636842 to your computer and use it in GitHub Desktop.
Save gavinblair/636842 to your computer and use it in GitHub Desktop.
Adds : after labels and * after required labels
/* Adds : after labels */
form label:after{
content:":";
}
/* Adds * after required labels */
form label.required:after{
content:"*";
}
@gavinblair
Copy link
Author

From the above link:

"The great thing here, and this is extremely die-hard web standards and semantics, is that an item’s title is not technically ‘Name:’ or ‘Age:’, rather it is just ‘Name’ and ‘Age’. The colon is, if you are being very anal, just stylistic."

@SeanJA
Copy link

SeanJA commented Oct 20, 2010

Doesn't work in IE6 though... which means you have to convince the client to allow things to look different in different browsers

@SeanJA
Copy link

SeanJA commented Oct 20, 2010

shouldn't it be: form label:after and form label.required:after then overridden in sub classes of the form? (ie: This isn't a special case, the other forms are the special cases, you wouldn't want this on the login form for example).

@gavinblair
Copy link
Author

Right, this solution is only good for sites that don't support IE6. I'm wondering now if it will work in IE7...

@gavinblair
Copy link
Author

Right, I guess that makes more sense (re: form vs. #myform). Updated.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment