Menu
I need something like html <ul> list.
It should contains bullets and something like textarea. 
textarea{
border : none;
}
.custom-txt-area{border-bottom : 1px dashed red;}<ul>
<li>
<textarea class="custom-txt-area" rows="1"></textarea>
</li>
<li>
<textarea class="custom-txt-area" rows="1"></textarea>
</li>
</ul>This is very sample example. Problem here - I can't make textarea extend it height to the bottom if it contans more than 1 row.
658
HTML5 allows for a ContentEditable attribute to be added to any HTML element. Assign a function to the onclick event for the list item, and make it set the ContentEditable attribute to true. 1+ But better use the property instead of the attribute: list. contentEditable = true; .
All you have to do is set the contenteditable attribute on nearly any HTML element to make it editable.
The contenteditable global attribute is an enumerated attribute indicating if the element should be editable by the user. If so, the browser modifies its widget to allow editing.
Answer: Use the HTML5 contenteditable Attribute You can set the HTML5 contenteditable attribute with the value true (i.e. contentEditable="true" ) to make an element editable in HTML, such as <div> or <p> element.
Maybe you are looking for contentEditable:
jsFiddle
<ul>
<li contenteditable="true">Edit ME!</li>
<li contenteditable="true">Edit ME!</li>
<li contenteditable="true">Edit ME!</li>
<li contenteditable="true">Edit ME!</li>
<li contenteditable="true">Edit ME!</li>
<li contenteditable="true">Edit ME!</li>
</ul>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
