Remove Resize handles and border from elements with contentEditable
The problem I'm having is with the contentEditable attribute in IE. (some things never change).
The problem is that I'm getting resize handles, and a thick border around <li> elements when they're in focus.
Any idea of how to remove them? CSS or Javascript tricks are very welcome!
Answers
Make sure the <li>s don't have "layout", since elements with "layout" inside an editable element get resize handles in IE. "Layout" is a hidden property of an element in IE that is set to true when any one of various CSS properties are enabled:
- position: absolute
- float (left or right)
- width or height (any value other than auto)
- min-width or min-height (any value other than none)
- overflow (hidden | scroll | auto)
- zoom (any value other than normal)
- display: inline-block
- various others
Here's a link from a quick googling that explains a bit more about layout: https://www.sitepoint.com/internet-explorer-haslayout-property/