Position :before pseudoclass in-between parent and child CSS -
(basically i'm trying style text field beyond normal capabilities, including filler text doesn't interact directly cursor.)
i wonder if it's possible position (using z-index if possible) :before element behind child elements of container element, in front of container background. (maybe you'd understand in bit)
html:
<div class="field" data-title="john"> <input type="text" name="firstname"> </div> css:
.field{ background-color:white; border:1px solid gray; } .field:before{ content:attr(data-title); } input[type="text"]{ background-color:transparent; border:none; outline:none; } this displays correctly:
however, i'm concerned because cannot focus text field if cursor on :before content (in case, word "john").
i understand :before can styled pointer-events:none, however, "pointer-events" tag not yet entirely cross-browser compatible.
hopefully made myself clear. @ appreciated. thank time.

Comments
Post a Comment