Css - adding text between [closed]

Question

Closed. This question needs debugging details. It is not currently accepting answers.

Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.

Closed 9 years ago.

Improve this question

I have HTML document, which i am not allowed to changing. In the other side, i have .css file with which i must to add text. I used the content property. The result must have text "NAME" before "input type="text" and text "NUMBER" before "input type="number".

The first one I already did with css code below in the link.

<div>
    <div>
        <div class="spacer"></div>
    </div>
</div>
<div>
    <div> 
        <input type="text" />
    </div> 
    <div>
        <input type="number" />
    </div>
</div>

My html code is here: http://www.beetxt.com/MZ2/ when I write here in the site it does show nothing.

And my CSS file: http://www.beetxt.com/Tdb/

But I dont know how to show text before " " without changing the HTML file. I can only use .css file, styles.

Possible duplicate of Insert HTML from CSS

Daniel Manta
– Daniel Manta

2016-04-07 19:15:52 +00:00
Commented Apr 7, 2016 at 19:15 — Daniel Manta
– Daniel Manta, Commented Apr 7, 2016 at 19:15

Paulie_D · Accepted Answer · 2016-04-07 20:34:23Z

2

Given that we have no classes or ID to hook on to we must use nth-child statements:

div:nth-child(2) div:first-child::before {
  content: 'NAME';
  display: block;
}
div:nth-child(2) div:nth-child(2)::before {
  content: 'NUMBER';
  display: block;
}
.spacer:after {
  content: "SPACER";
}

<div>
  <div>
    <div class="spacer"></div>
  </div>
</div>
<div>
  <div>
    <input type="text" />
  </div>
  <div>
    <input type="number" />
  </div>
</div>

edited Apr 7, 2016 at 20:34

answered Apr 7, 2016 at 19:12

Paulie_D

116k13 gold badges168 silver badges185 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jolek111 Over a year ago

This one is working fine for me, just one little request more. How to do, that is the words "name" and "number" does not show in the same line that is input ?

Jolek111 Over a year ago

I'm really sorry about my english, it is my third language. s9.postimg.org/s0nc6kp7j/pic1.png When i use your code i get version 1 on the picture, but i will need version 2 on the picture. Picture is in te link below: s9.postimg.org/s0nc6kp7j/pic1.png

Collectives™ on Stack Overflow

Css - adding text between [closed]

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related