2

like what the title says I'm trying to add a specific content to a part of a page. Obviously this is a desperate resort because I'm unable to modify the codes manually. So far this is what I have.

.paper-form input[name="elements[bd67ba9a-507b-4214-98a3-5abd36562937]"]:after {
content:'test';
 }

From what I did the name selector is working but once I added the :after It just doesn't work. Can anyone tell me I'm not used to using pseudo codes. Thanks in advance.

Tonzkie
  • 539
  • 2
  • 6
  • 18
  • Though I don't have any specifics to give you, I have a feeling it's because you're applying to an `input`. Here's a related link: http://stackoverflow.com/questions/2587669/css-after-pseudo-element-on-input-field – hungerstar Aug 14 '13 at 07:01
  • Oh I can't do that. God damn it. – Tonzkie Aug 14 '13 at 07:02

2 Answers2

3

:before and :after will not work with input elements, you have to write css like this

.paper-form:after {
    content:'test';
 }

well described in this article http://www.w3.org/TR/CSS2/generate.html#before-after-content

Roy Sonasish
  • 4,571
  • 20
  • 31
0

Can I use the :after pseudo-element on an input field?

(originally quoted comment in post above)

...the answer on which it is commenting has it right. What matters is that input is a replaced element. The :before and :after pseudo-elements form part of the content of the element which is replaced, which is why it doesn't render. As is pointed out on that page, on <hr>, which a void element but not replaced, :before and :after pseudo-elements are rendered. – Alohci

Community
  • 1
  • 1
hungerstar
  • 21,206
  • 6
  • 50
  • 59
  • 1
    Note that the quoted comment is incorrect, and the answer on which it is commenting has it right. What matters is that input is a **replaced element**. The :before and :after pseudo-elements form part of the content of the element which is replaced, which is why it doesn't render. As is pointed out on that page, on `
    `, which a void element but not replaced, :before and :after pseudo-elements are rendered.     – Alohci Aug 14 '13 at 07:31