Slider is not positioned and visualized correctly in igxGrid cell

[zdrawku]

Description

Slider is positioned at the top area of its container. Also, in order to visualize the slider, I have to set 100% height and width of the component, if this is not set, the whole slider is hidden and only the igx-thumb element is visible

<igx-column field="UnitPrice" header="Unit Price" dataType="number" width="200px">
            <ng-template igxCell let-cell="cell" let-val let-row>
                <igx-slider id="slider" [minValue]="0" [maxValue]="100" [continuous]="true" [value]="val" style="width: 100%; height: 100%" ></igx-slider>
            </ng-template>
        </igx-column>

• igniteui-angular version: 8.2.0
• browser: any

Steps to reproduce

1. Open the sample
2. See Unit Price column

Result

The slider is positioned at the top area of the cell.

Expected result

The slider to be positioned at the center area of the cell.

Notes:

• I believe the issue with the position is caused by nghost display:block style, because when I disable it, everything is working as expected.

[_nghost-kmr-c2] {
    display: block;
}