How to remove Ribbon's top white space above the tabs?

[James Pham]

Hi, which CSS attribute removes the white area above the ejRibbon tabs (highlighted red in the screenshot attachment)?

Attachment: Ribbon_Top_Highlighted_e1b80d14.zip

[Kavitha Narayanan]

Hi James, 

 

Thank you for contacting Syncfusion support. 

 

Query: which CSS attribute removes the white area above the ejRibbon tabs  

 

We used padding-top CSS property to remove the white space of the Ribbon control. 

 

Please refer to the code and sample. 

 

 

.row .cols-sample-area { 

            padding-top: 0px; !important; 

        } 

 

 

Sample: http://www.syncfusion.com/downloads/support/directtrac/124375/ze/sample-966000558.zip  

 

Regards, 

Kavitha N. 

 

[Kavitha Narayanan]

Hi James, 

 

Please ignore the previous update. 

 

Query: which CSS attribute removes the white area above the ejRibbon tabs  

 

We have set height and margin top to the Ribbon header for remove the white area. 

 

Please refer to the code and sample. 

 

 

<style> 

        .e-ribbon .e-header>li{ 

            margin-top: 0px !important; 

        } 

        .e-ribbon.e-js>.e-header{ 

            height: 33px; 

        } 

        </style> 

 

 

Sample: http://www.syncfusion.com/downloads/support/forum/124375/ze/sample-667679992.zip  

 

Regards, 

Kavitha N.