Question

I have some HTML DIV elements that contain a narrative style of form. For instance:

<div class="narrative">
    My name is <input type="text"> and I am <input type="text"> years old.
</div>

Is there a way to detect with CSS if there is plain text before the first <input> element so I can add a left margin? If not, suggestions for ways to do this without having to class that first input or wrap the plain text in a span?

It won’t always be preceded by plain text:

<div class="narrative">
    <input type="text"> is <input type="text"> years old.
</div>

Answer 1

CSS can only select elements, not individual text nodes within elements. This is something you’d have to do through DOM scripting and CSS.