Make the width 100% of textarea inside an xeditable using angularJS

Problem

In this example when the user want to edit the row or to add a new one, you can see the width of text-area(Description column) don't follow the width of the td, so I added some CSS, but no changes. So how can I make the width take the 100% of the td using CSS ?

This is the code :

      <span style="width:100%" editable-textarea="user.status" e-name="" e-form="rowform" e-ng-options="s.value as s.text for s in statuses">
           {{ showStatus(user) }}
      </span>

This is the EXAMPLE.

Problem courtesy of: Mils

Solution

The span that you are adding width: 100% to actually gets hidden. What you need to do is update the CSS for the class of the span that appears that wraps the inputs. Seems to be .editable-wrap

http://jsfiddle.net/NfPcH/660/

Solution courtesy of: Explosion Pills

Discussion

There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.