Cross-browser multi-line text overflow with ellipsis appended within a fixed width and height

Question

I made an image for this question to make it easier to understand.

Is it possible to create an ellipsis on a

with a fixed width and multiple

Answer 1

The mentioned dotdotdot jQuery plugin work nice with angular:

(function (angular) {
angular.module('app')
    .directive('appEllipsis', [
        "$log", "$timeout", function ($log, $timeout) {
            return {
                restrict: 'A',
                scope: false,
                link: function (scope, element, attrs) {

                    // let the angular data binding run first
                    $timeout(function() {
                        element.dotdotdot({
                            watch: "window"
                        });
                    });
                }
            }

        }
    ]);
})(window.angular);

The corresponding markup would be:

{{ selectedItem.Description }}