Back button not working in firefox

[Dan]

Im having trouble with the back button.  For some reason when i hover my mouse over it in Firefox 16.0.1 it doesnt register it as a link when the data-role="backbutton" is applied.  When i remove it it works great. 

When I go into Safari, the back button works.  Its weird, in FF the backbutton is styled pretty poorly, loooks like something isnt working.  Any thoughts on this

<div data-role="pane" data-layout="side-default" data-transition="slide">

    @* Menu: Level 1 *@

    <div data-role="view" data-title="Centro Web Panel" id="side-root">

        <header data-role="header">

            <div data-role="navbar">

               <span data-role="view-title"></span>

            </div>

        </header>

 

        <ul data-role="listview" data-style="inset" @*data-source="splitViewCategories" data-template="categoriesTemplate"*@>

            @* TODO: Get rid of hard coded stuff *@

            <li><a class="km-listview-link" href="#side-inbox" data-role="listview-link">Todo</a></li>   

            <li><a class="km-listview-link" href="" data-role="listview-link">Drafts</a></li>   

            <li><a class="km-listview-link" href="" data-role="listview-link">Pending</a></li>   

            <li><a class="km-listview-link" href="" data-role="listview-link">Completed</a></li> 

        </ul>

    </div>

 

    <div data-role="view" data-title="Todo" id="side-inbox">

        <header data-role="header">

            <div data-role="navbar">

                <a id="back-button" class="nav-button" data-align="left" data-role="backbutton">Back</a>

                <span data-role="view-title"></span>

            </div>

        </header>

         

        <ul data-role="listview" data-style="inset">

            <li><a class="km-listview-link" href="" data-role="listview-link">Cardiology</a></li>   

            <li><a class="km-listview-link" href="" data-role="listview-link">Radiology</a></li>   

            <li><a class="km-listview-link" href="" data-role="listview-link">All Patients</a></li>   

        </ul>

    </div>

 

</div> @* --> end of left menu area *@

[Kamen Bundev]

Hi Dan,

Kendo UI Mobile is fully supported in WebKit based browsers only. You will most likely face numerous issues in Firefox due to its broken Flexbox support and not supporting image masks. The SplitView will misbehave for sure, please avoid using it if you plan to deploy to Firefox.

That said, we do provide a SVG workaround for the masks, so, in order to get the button icons and the back button working, your server has to be configured to serve SVG files - the correct mime type is image/svg+xml. This issue will be avoided in Q3 when we will switch to icon fonts.

Kind regards,
Kamen Bundev
the Telerik team