Kendo device specific css - kendo-ui

Working in Kendo UI Mobile, is it possible to define device specific css elements.
For example to perform platform specific css for iOS and Android I use
.km-ios .km-view-title
{
height: 40px;
color: #fff;
}
.km-android .km-view-title
{
height: 50px;
color: #000;
}
however how to specify between iPhone 4 and iPhone5, is it possible?

Kendo UI Mobile does not provide device specific classes. You can add such class manually, based on the difference of the screen height.

Actually Kendo UI Mobile does add platform version CSS classes by concatenating the platform class and its major version. So, you can target iOS5 with .km-ios5 and Android 2.x with .km-android2.
There's one additional catch - iOS7 doesn't have the .km-ios class that previous iOSes have - this is due to the major redesign the platform received, so Kendo UI Mobile considers it separate.

Related

Firefox is not displaying Navbar images properly other browsers don’t have this issue

Page is not showing photos in a proper way in Firefox browser unlike other browsers which are working well , i'm using bootstrap 4
Chrome View
Firefox View
I solve the problem by adding class define the minimum width and height for images:
.img-nav{
min-width: 108px;
min-height: 64px;
}
it works well on all browsers.

how to reduce the native font size of a windows cordova app?

I have a windows Cordova app and I want to reduce the font size of its native elements (for eg, the drop-down list)
I found out that the font size is being set from a theme file which is not editable. can I override the font size?
Cordova renders the content of your app in the Windows WebView control which is the only native control that it renders. So everything inside your Cordova app is essentially a web app running in the WebView control. This means that you could reduce the font size of the drop-down list by adjusting the CSS class associated with the drop-down list or in general the CSS for the body element.
E.g. In your CSS file:
body { font-size: 80%; }

Navigation in mobile application does not work in kendoui professional 2014.1.528

I updated to version 2014.1.528 kendoui in my mobile application. When I run and navigates to another view, it is in the newly opened view, I can not click on anything. I see that the div element where the views are added style pointer-events: none; In the old version all is well.
I tried to run the official demo kendo ui mobile and as I click on: Remote view, it does not work. But only downloaded demos. On the http://demos.telerik.com/kendo-ui/mobile-view/index, is well

Asp.Net Panel control in MVC3 Razor

Is it possible to use Panel control(Asp.net) with scrolling in MVC3 Razor? If not what will be the alternative for this control?
I found it as very simple one. Thanks Sternr. I used div instead of Panel
coding
CSS will be
{
width:180px;
height:584px;
background-color:#CCCCCC;
float:left;
overflow:auto;
}
And if you don't need horizontal / vertical scroll specifically
You can give like
overflow-x:Hidden; Or
overflow-y:Hidden.
I didn't check compatibility for all browser versions. But it works fine on Chrome 13.0.782.107, Firefox 5.0 and IE 9
For IE8:
-ms-overflow-y: hidden;
Thanks

Is there a jQuery plugin with functionality of CSS3 flexible box model?

I want an element organization in my UI equivalent to the results of following CSS:
#wall {
width: 100%;
display: box;
box-orient: horizontal;
box-align: stretch;
box-lines: multiple;
}
Unfortunately browsers do not seem to support box-lines: multiple;, and some widely used browsers do not yet support flexible box model at all.
Is there an existing jQuery plugin that provides this functionality?
You asked about this a while ago, but in case you have not looked into this lately, this is a great tool to provide support for the Flexible Box Model in browser that don't support it yet.
Cross-browser support for the Flexible Box Model

Resources