Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 158 Stack Exchange communities.

What is meta?
Here's how it works:
  1. Any Stack Exchange user can ask a question
  2. The community provides support, votes on ideas, and reports bugs
  3. Your voice helps shape the way Stack Exchange operates

I suggest adding the following CSS to <kbd> tags (such as Space) so that the top right and bottom left corners do not look slightly odd.

Solution is to round those two corners in such a way that they do not exactly look rounded.

kbd { border-radius: 0 3px; -moz-border-radius: 0 3px; }

This produces: (Old on the left, new on the right)

Space (old) versus Space (new)

This slight change will make practical uses much better looking. While still preserving the layout of all the art that has been created.

share|improve this question
I can see the difference when I compare the new and old styles side by side, but I don't think I would notice in any other case. – Pops Nov 28 '11 at 17:47
I just thought it looked a lot more 3-dimensional, where the other one looks like a bit sloppy. This I noticed right away the first time I saw the formatting used. I only just now thought of this tweak. I don't know what the policy is on small tweaks like this, but I thought I would mention it since it seems to be a one-liner. P.S. you could of course use 4px :) – George Bailey Nov 28 '11 at 17:52
Still too ugly for me. Ban <kbd>! – Arjan Nov 28 '11 at 17:56
+1 to this or something similar. Ask Different already adds a border-radius and a drop-shadow (example) and it looks good. – Jeremy Banks Nov 28 '11 at 17:56
If you want a 3D effect, perhaps you'd be interested in the outset property instead? See also Can we have the nicer Apple SE/Ask Different <kbd> tag network-wide? – Pops Nov 28 '11 at 18:01
+1 for this. Definitely an improvement over the current style, but not a breaking design change. – Adam Maras Nov 28 '11 at 20:25
<kbd>, representing user input, should not render to look like keys at all. Like, according to the wiki: input "<kbd>Yes</kbd>" or "<kbd>No</kbd>". To represent actual keys, all <kbd>'s should be wrapped into a parent <kbd>... That looks even worse. – Arjan Dec 7 '11 at 13:14
@Arjan, I think the amount of people who care about having proper display of nested <kbd> tags is very small. But it is interesting to know what the original intent was. – George Bailey Dec 7 '11 at 14:25
I know, @George, still I was brave enough to boldly ask for downvotes, errr, Ban <kbd>, its usage and rendering are incorrect ;-) – Arjan Dec 7 '11 at 14:37
@Arjan, Are you insane? :) – George Bailey Dec 7 '11 at 21:12
up vote 2 down vote accepted

Keyboard styles were adjusted on the trilogy and (hopefully) most SE 2.0 sites where we weren't already doing this.

share|improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .