As the title states, I'm trying to find a good solution to implement inline editing for a web order form with just HTML/CSS.

The only mediocre solution I have right now is this -> http://jsfiddle.net/jmggp/1/

But I think it looks unprofessional. Are there any other solutions that I can try to learn about?

  • 2
    I'm not sure what you mean by "inline editing"? Your example looks like a standard HTML form with individual fields (without labels)?
    – MrWhite
    Jan 25, 2013 at 16:59
  • 1
    You are using the placeholder attribute for your forms, these can be styled with CSS too, but it's not compatible with all browsers. Take a look at this site.
    – chrki
    Jan 25, 2013 at 17:01
  • sorry to be more clear, I mean inline editing like this -> zkoss.org/zkdemo/grid/inline_editing @w3d Jan 25, 2013 at 17:13

2 Answers 2


I'm afraid you'll have to rely on JavaScript if you plan on serving the same possibilities for all the browsers your visitors would be using. It is possible to do it without JS using HTML5 but then you have the problem of requiring modern browsers.

To take a look at inline editing using HTML5 I recommend you take a look at: http://html5demos.com/contenteditable


Sorry, but inline editing requires JavaScript - the HTML/CSS of a page cannot be changed without it. The HTML is the content that your webserver sends to your visitor's browser; it is static. The CSS (also static) tells the browser how to display the content. In order to change the content after it reaches the browser (as in editing), you have to use JavaScript.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.