Hello,
We have a mobile app that uses a list view with data-style is inset and data-type is group. The app is also used with IE on Windows as well. Right now the KendoUI version is 2013 Q3.
When we use the list view in IE 11, the background color for each group caption is grey. A sample html is below and the image is attached:
<!DOCTYPE html>
<html>
<head>
<title>Basic usage</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
<script src="../../../js/jquery.min.js"></script>
<script src="../../../js/kendo.mobile.min.js"></script>
<script src="../../content/shared/js/console.js"></script>
<link href="../../../styles/kendo.mobile.all.min.css" rel="stylesheet" />
<style>
[href*=index], #back-button
{
visibility: hidden;
}
</style>
</head>
<body>
<div data-role="view" data-title="Destinations" id="listview-home">
<ul data-role="listview" data-style="inset" data-type="group" style="background-color: #8e8;" >
<li>Africa
<ul>
<li data-icon="toprated"><a>Nairobi</a></li>
</ul>
</li>
<li>
America
<ul>
<li data-icon="globe"><a>Bostonaa</a></li>
<li data-icon="globe"><a>Ottawa</a></li>
<li data-icon="toprated"><a>San Francisco</a></li>
</ul>
</li>
<li>
Asia
<ul>
<li data-icon="globe"><a>Bombay</a></li>
</ul>
</li>
<li>
Australia
<ul>
<li data-icon="globe"><a>Melbourne</a></li>
<li data-icon="toprated"><a>Sydney</a></li>
</ul>
</li>
<li>
Europe
<ul>
<li data-icon="globe"><a>Cannes</a></li>
<li data-icon="globe"><a>Liverpool</a></li>
<li data-icon="toprated"><a>London</a></li>
</ul>
</li>
</ul>
</div><style></style>
<script>
window.kendoMobileApplication = new kendo.mobile.Application(document.body);
</script>
</body>
</html>
As you see the background color for captions for "Africa", "America", "Asia" are grey and I tried change the style but am unable to set so far.
Is there any way to change this?
Thanks!