<form> <input class = 'reg' id = 'log' placeholder = 'Логин' style = 'display:none' maxlength="16"></input> <input class = 'reg' id = 'pass' placeholder = 'Пароль' style = 'display:none' type = 'text' maxlength="10"></input> <input class = 'reg' id = 'rep' placeholder = 'Повторите пароль' style = 'display:none' type = 'password'></input> </form>

CSS

 .reg { position: absolute; padding: 10px; margin-left: 300px; border-radius:10px; box-shadow: 0 1px 0 #ccc inset; transition:500ms all ease; width: 150px; } .reg:hover { width: 180px; } #log { margin-top: 150px; } #pass { margin-top: 200px; } #rep { margin-top: 250px; }

  • Position:absolute I need, because I put an element on canvas. What is the problem?

  • style='display:none' at a certain level is converted to style='display:block'

The maxlength parameter maxlength stupidly ignored, in spite of maxlength="12" I can enter any number of characters. What is the problem that hinders?

Thanks in advance for your reply)

  • btw my code from your example works with non-single tags - Duck Learns to Take Cover

1 answer 1

input - single tag (does not close):

 .reg { position: absolute; padding: 10px; margin-left: 300px; border-radius:10px; box-shadow: 0 1px 0 #ccc inset; transition:500ms all ease; width: 150px; } .reg:hover { width: 180px; } #log { margin-top: 150px; } #pass { margin-top: 200px; } #rep { margin-top: 250px; } 
 <form> <input class = 'reg' id = 'log' placeholder = 'Логин' maxlength="16"> <input class = 'reg' id = 'pass' placeholder = 'Пароль' type = 'text' maxlength="10"> <input class = 'reg' id = 'rep' placeholder = 'Повторите пароль' type = 'password'> </form>

  • Thank you, I forgot about it, I haven’t written sites for too long) - TitaN
  • I am not quite sure that this caused the author’s problem. Well, I advise single tags to still close <input />, it certainly will work with a normal doctype - Duck Learns to Hide
  • @ Duck Learning, yes, you can advise anything, but correctly write single tags as they are intended by the developers! - HamSter
  • 2
    @Elena is actually and so it is possible, just self-closing is such a syntactic sugar to make more xml-like - Duck Learns to Hide
  • five
    @Elena, very cute) Here is the source for which I am studying the html: w3c specification. w3.org/TR/html5/syntax.html#start-tags . Pay attention to point 6. If you do not know, then the specification is how the developers conceived. My argument for self-closing tags is related to compatibility considerations with XML specs, which are not practical in most cases, but sometimes come up. Ah, what am I talking to you about the specifications? What source of html5 did you learn from? - Duck Learns to Take Cover