Skip to content
This repository

css problems between 1.2.0.alpha.1 and 1.2.0.rc.1 #5008

joejoint opened this Issue September 14, 2012 · 6 comments

3 participants

joejoint Jasper de Groot steven-fernandez

The following page renders fine with
but fails with both and

    <div data-role="page" id="test">
        <div data-role="content"  >
            <ul data-role="listview" data-inset="true" style="margin-top:0">
            <li data-role="list-divider">  </li>
                <div data-role="navbar" id="line_bar_r" data-theme="c">
                        <li><a href="#" class="ui-btn-active">Item 1</a></li>
                        <li><a href="#" >Item 2</a></li>
                        <li><a href="#" >Item 3</a></li>

            <div id="div_line_r" style="padding-bottom:5px" >
                <select  name="line" id="line_r" value="" data-mini="true" />                   
                    <option >0</option>
                    <option >1</option>
Jasper de Groot


Thanks for reporting the issue. This is a regression from 7f312da :(
Looking into it.


.ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li { min-height:40px }; seems to sort it, don't know if you're using min-height on jqm or not though...

Jasper de Groot

Overflow hidden set on the UL made sure the navbar get a height while the LI's (buttons) are floating.
We removed that because of an issue on Android ICS, but maybe it can be set for the ui-navbar div. Have to test that.
Otherwise setting a min-height could be a solution indeed.


Good call :) Yeah, overflow: hidden; on the .ui-navbar div sorts the issue like you said.

Jasper de Groot

Setting overflow hidden on ui-navbar results in the same problem (#4663) on Chrome on Android ICS and JB.
Setting a min-height of 38px isn't the solution either, because when you use icons positioned above the text you will still have an issue.

All I can think of now is using a "clearfix":

.ui-navbar ul:before, .ui-navbar ul:after { content: " "; display: table; }
.ui-navbar ul:after { clear: both; }
.ui-navbar ul { /*... other properties ... */ zoom: 1; }

I see...Yeah I guess you have to think of all the different posibilities :)

Jasper de Groot uGoMobi closed this in 446fed7 September 17, 2012
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.