NavBar height

[Mauro]

Hi,

I'm testing kendoui Mobile and I've noticed that navbar is higher than the one in iOS native apps... how can I modify it? Also the icons are too big... is there a way to make them smaller (like forcing dimensions for example)?

Thanks a lot
Mauro

[Iliana Dyankova]

Hello Mauro,

You could modify the dimensions using custom CSS. For example you could decrease the height of the list items in Kendo UI Mobile NavBar: 

.km-ios .km-list > li {
  line-height: 0.6em;
}

Also you could decrease the size of the images using the following code snippet: 

#navbar-home img, #navbar-grouped img {
 width: 2em;
 height: 2em;
}

 Regards,
Iliana Nikolova
the Telerik team

[Mauro]

Hello Iliana,

thanks for your reply... I also need to change the height of the footer and the icons inside of it (I mean tabstrip)...
how can I do?

What is the difference of <div data-role="footer"> and <footer data-role="footer"> ?

And between using <style scoped> inside body tag and <style> in the header?

Thanks a lot
Mauro

[Petyo]

Hi,

You can read more about the footer tag in the spec. As per the style tags and their appropriate usage, you can take a look at our documentation. 

Regards,
Petyo
the Telerik team