-8

Ctrl + C

^ Just why?

Can kbd kbd get different formatting? How about a nested samp?

<kbd><kbd><samp>File</samp></kbd> <kbd><samp>Save</samp></kbd></kbd>

File Save

14
  • 4
    Why would you want to do this?
    – Andrew
    Aug 10, 2014 at 19:01
  • 1
    @SantaClaus That's how the spec says you're supposed to use it.
    – bjb568
    Aug 10, 2014 at 19:02
  • @bjb568 what spec? link? Aug 10, 2014 at 19:03
  • @JanDvorak dev.w3.org/html5/spec-preview/the-kbd-element.html
    – bjb568
    Aug 10, 2014 at 19:03
  • Not that it matters, but bootstrap added special styling for this. github.com/twbs/bootstrap/issues/14168
    – Andrew
    Aug 10, 2014 at 19:04
  • 1
    Related from MSE: meta.stackexchange.com/questions/215133/…
    – Andrew
    Aug 10, 2014 at 19:07
  • 4
    I read @Santa's "Why would you want to do this?" not as why would you want to add <samp> tags but why on earth would you want to use nested <kbd>s anywhere?
    – Ben
    Aug 10, 2014 at 19:13
  • @Ben Semantic HTML? …
    – bjb568
    Aug 10, 2014 at 19:14
  • @Ben When I commented, the question didn't actually say anything about <samp>, so you are correct.
    – Andrew
    Aug 10, 2014 at 19:14
  • Sorry @bjb, I'm not a front-end web-dev so while I understand the concept I still see no need for nested kbd's... I understand from your link that w3 have stated that that is the standard for key-presses but I have no idea why and unless they can convince the ordinary masses it won't be.
    – Ben
    Aug 10, 2014 at 19:20
  • 1
    @Ben One usage is, for example, to identify the sequence (Ctrl+C), (Shift+D) as distinguished from (Ctrl), (C), (Shift), (D) or (Ctrl+C+Shift+D) -- presuming that (Ctrl+C) and (Ctrl+D) are a single "unit" of input each, as it were.
    – Jason C
    Aug 10, 2014 at 23:25
  • 1
    You managed to explain that very well without needing them @Jason!
    – Ben
    Aug 11, 2014 at 18:51
  • 1
    @Ben That's not a valid argument against (although I'm not sure why anybody would care to argue either way) as it can be said about virtually all markup. Text has always been effective for communication. Formatting is a bonus.
    – Jason C
    Aug 11, 2014 at 19:26
  • 1
    @JasonC That's part of the feature request - there should be.
    – bjb568
    Aug 11, 2014 at 20:35

3 Answers 3

4

As to why you would want to nest them, here it is from the horse's mouth:

When the kbd element is nested inside another kbd element, it represents an actual key or other single unit of input as appropriate for the input mechanism.

Mozilla give two examples of kbd usage, one of which uses nesting:

<p>Save the document by pressing <kbd><kbd>Ctrl</kbd>+<kbd>S</kbd></kbd></p>

They show the results below on the same page.

2
  • 1
    The horse is an HTML5 draft, work in progress, containing a rather contrived idea here. The idea might be partly based on usage shown at the start of the question, the Ctrl + C case. Approved HTML specifications do not say anything about nesting kbd (except that syntactically they can be nested). Aug 11, 2014 at 20:09
  • @JukkaK.Korpela indeed. And indeed I have no particular allegiance--not flogging an unborn horse--just giving the full quote for clarity, as a few were wondering about it since bjb568 first provided the link
    – Reg Edit
    Aug 12, 2014 at 7:02
1

Nested kbd elements look what they look at SO just because SO defines their style so that they look like buttons of a kind. If you nest them, the result thus looks like a button inside a button. The button-like appearance is meant to make things look like keyboard keys, more or less. The practical implication is that at SO, you should use kbd only for describing keypresses.

Since kbd means user input (or specifically keyboard input), there is no logical reason to nest kbd elements. There is often need to indicate that some keypresses belong together (e.g., you are expected to press the “C” key while keeping the “Ctrl” key pressed down, instead of pressing first “Ctrl”, then “C”). There is no really satisfactory way to do that. You normally need to rely on general understanding or on verbal explanations.

19
  • I know how it works. But how it works can be changed. If how it works doesn't comply with the spec, how it works should change.
    – bjb568
    Aug 10, 2014 at 19:52
  • 1
    @bjb568: Jukka's point is there is no reason to change it. One can think of oodles of unlikely combo's, say, "should <i>..</i> nested in itself be regular again?"
    – Jongware
    Aug 10, 2014 at 19:54
  • 1
    @bjb568: SO's markup doesn't have to comply with the spec for HTML. It's markup used at SO. Feel free to write HTML anywhere else you like and ask them to support the standard if their site says that they do so.
    – Ken White
    Aug 10, 2014 at 19:54
  • @KenWhite Nobody has to do anything, that doesn't mean that they shouldn't.
    – bjb568
    Aug 10, 2014 at 19:57
  • 1
    @bjb568: It works as designed here for the purpose it's designed to be used here. Why should it change? Because you say so?
    – Ken White
    Aug 10, 2014 at 19:58
  • @KenWhite Because the spec says so.
    – bjb568
    Aug 10, 2014 at 20:01
  • @bjb568: Terrific. We've circled right back to my first comment to you. Can you read it again and save me typing it over?
    – Ken White
    Aug 10, 2014 at 20:03
  • @KenWhite My point is that SO should comply with the spec.
    – bjb568
    Aug 10, 2014 at 20:04
  • @bjb568: Yes, I know. We've been over that already. Are you even reading what you and I have been typing? Start again at the top of these comments and re-read them all again.
    – Ken White
    Aug 10, 2014 at 20:05
  • @KenWhite … and your point is that compliance is worthless?
    – bjb568
    Aug 10, 2014 at 20:06
  • @bjb568: No. Read my first comment again, which clearly states the point I'm making. (Gosh, I really feel like we're going around and around in circles here. You don't read, say something that's been said before, I remind you it's been said before, you don't read, say something else that's been said before, I remind you...)
    – Ken White
    Aug 10, 2014 at 20:08
  • 3
    @Jongware That's... not even relevant. Italicized text nested within italicized text should be, well, italicized. If some website randomly put 5px of padding on all their italicized text, then nesting them inside each other suddenly becomes extremely irritating. Sure, there might have been a good reason to do that for a single one, but they definitely should have thought about what happens with multiple nested elements. -- Aside: I don't particularly care if Stack Exchange changes their CSS to compensate, I have my custom CSS that makes my page look pretty. If others don't care, oh well.
    – animuson StaffMod
    Aug 10, 2014 at 20:10
  • 2
    @bjb568: You're not writing HTML, though. You're writing SO markup. If you were writing plain HTML, you could include tables and other things that are not permitted at SO. The fact they're displayed as HTML doesn't mean that's what you're permitted to write. And I said you should discuss problems with missing standards support with sites that tell you they support them but don't; SO doesn't make that claim. They claim to support the markup that is allowed at SO.
    – Ken White
    Aug 10, 2014 at 21:00
  • 1
    @bjb568: No, of course not. Don't be ridiculous. I'm saying that when you post to SO and use certain markdown, you're using markdown that may include sanitized HTML (but it may include something else totally as well). I give up; you're clearly trying to argue by injecting meaning into my words that isn't even close to what I actually wrote.
    – Ken White
    Aug 10, 2014 at 23:07
  • 2
    @KenWhite Even if this thing that looks suspiciously like HTML is not meant to be like HTML (it is), people expect it to behave like HTML (because it is). It's beneficial to comply with the spec because that's what people expect.
    – bjb568
    Aug 10, 2014 at 23:17
1

I was trying to figure out what you were talking about, then I realized I have custom CSS to fix this annoying issue:

kbd kbd, blockquote blockquote {
    background: none;
    border: 0;
    box-shadow: none;
    margin: 0;
    padding: 0;
}

Note I also use these same styles to prevent the annoying nested blockquotes.

1
  • 2
    I don’t see how this answers any of the questions asked. It may well be a good answer, but to different question. Aug 11, 2014 at 20:05

You must log in to answer this question.

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