Merge pull request #6185 from IgniteUI/fix-5973

feat(slider): Fix slider position inside grid cell

Author: rkaraivanov

projects/igniteui-angular/src/lib/core/styles/components/slider/_slider-theme.scss

@@ -128,6 +128,7 @@
         display: flex;
         position: relative;
         height: rem($slider-height);
+        flex-grow: 1;
         align-items: center;
         transition: all .2s $ease-out-quad;
 

projects/igniteui-angular/src/lib/slider/slider.component.spec.ts

@@ -638,6 +638,7 @@ describe('IgxSlider', () => {
         it('tick marks(steps) should be shown equally spread based on labels length', () => {
             const ticks = fixture.nativeElement.querySelector('.igx-slider__track-ticks');
             const sliderWidth = parseInt(fixture.nativeElement.querySelector('igx-slider').clientWidth, 10);
+            fixture.detectChanges();
 
             expect(slider.type).toBe(SliderType.SLIDER);
             expect(ticks).toBeDefined();
@@ -922,6 +923,7 @@ describe('IgxSlider', () => {
         it('tick marks(steps) should be shown equally spread based on labels length', () => {
             const ticks = fixture.nativeElement.querySelector('.igx-slider__track-ticks');
             const sliderWidth = parseInt(fixture.nativeElement.querySelector('igx-slider').clientWidth, 10);
+            fixture.detectChanges();
 
             expect(slider.type).toBe(SliderType.RANGE);
             expect(ticks).not.toBeNull();

projects/igniteui-angular/src/lib/slider/slider.component.ts

@@ -51,12 +51,7 @@ let NEXT_ID = 0;
 @Component({
     providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: IgxSliderComponent, multi: true }],
     selector: 'igx-slider',
-    templateUrl: 'slider.component.html',
-    styles: [`
-        :host {
-            display: block;
-        }
-    `]
+    templateUrl: 'slider.component.html'
 })
 export class IgxSliderComponent implements
     ControlValueAccessor,