CSS input styling antics.

Dear Lazyweb, How do I style an INPUT element so that its contents behave like a DIV, wrapping text and expanding height to fit? I have a page that has an "edit' mode where I've got a bunch of populated form elements, and in...
jwz.org/b/ykEU

@jwz

<Input> is for one line of plain text only, with no wrapping.

If you need multiline and line wrapping too, you should use <textarea>.

If plain text is not enough, there is contenteditable; but usually is a pain to manage, so if you can't avoid this requirement, you better use one of the many libraries for editing rich text.

@jgg As you can see from my example, textarea also doesn't work, as it does not auto-size height like div does.

"Include half a megabyte of some bullshit framework" is about the most useless of all possible suggestions.

@jwz

Sorry, missed that point. You may find this helpful: css-tricks.com/the-cleanest-tr

Why are you so hostile to using libraries? It is what everybody has been doing for rich text editing since rich text editing on the web became a thing. Reinventing the wheel never was a good engineering practice.

@jgg Why am I so hostile to libraries? Because I'm not the kind of person who buys a new car because the "check engine" light came on.

But please, lecture me on good engineering practices. I'm sure you have a lot to teach me.

Follow

@jwz

You must be kidding. Every medium to big web application uses many external libraries. Why should they not?

If I were to tell a client that I am going to charge him 3 months of development, instead of adding a well know free small nicely working library, I would lost a client. Moreover, a library that has been tested and refined during years by thousands of developers is very likely to work much better than anything I can deliver in 3 months.

I try to avoid bloating my apps adding libraries mindlessly, but definitely there is a place for them. For example, if I have to display a complex interactive 3D element, I'm not making a 3D engine from scratch for it, unless I have strong reasons to do so.

If you have the budget and the time to never use any kind of libraries, be my guest. But don't even dream that the rest of us have that luxury, nor the inclination.

@jgg FWIW, I do this commercially, ie almost never use third-party code, with very few exceptions, in high-end client projects. It’s actually great for development pace, provided that you can build almost anything in a few days. 3rd party code adds up to a lot of cost down the line for a sufficiently senior dev team. Honestly I find many people tend to prefer a dramatic crackdown on 3rd-party libs around a transition from senior to principal levels.

Sign in to participate in the conversation
CleverLibre Social

CleverLibre Social is an inclusive social instance for open discussion, learning, and community.
All cultures welcome.
Hate speech and harassment strictly forbidden.