Very small border around selected text in the Editable Table


Topic: Very small border around selected text in the Editable Table

Using an Editable Table and selecting a text in an editable cell - The displayed border is very small. It seems to be no margins around the text.

According to the sample https://mdbootstrap.com/docs/angular/tables/editable/ an editable cell should be implemented like this.

<td>
  <span (keyup)="changeValue(id, 'name', $event)" (blur)="updateList(id, 'name', $event)" contenteditable="true">{{person.name}}</span>
</td>

If I put the attributes (like "contenteditable") on the TD instead the whole table cell will be framed when it is selected (like https://ng-demo.mdbootstrap.com/tables/editable)

How is it intended to work?


Arkadiusz Idzikowski staff answered 6 years ago

Those span elements were added because of problems on Edge browser. We will update live example so that it matches to the code visible in the documentation.


peter.r.bladh@saabgroup.com commented 6 years ago

But when I use the SPAN elements and click on the table cell, the blue border gets very small.


Arkadiusz Idzikowski staff commented 6 years ago

We will take a closer look at it and update the styles.


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 7.4.1
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes