ui-corner-* classes missing from 1.3 beta1 themes #5511

owais opened this Issue Jan 22, 2013 · 3 comments


None yet

3 participants

owais commented Jan 22, 2013

I upgraded from Jquery mobile 1.2 to 1.3Beta1. I noticed that the following classes have been removed from the default theme.


These classes were very useful. Were they removed on purpose or accidentally? According to the 1.3 docs, they should still be there but they are not.


They were removed on purpose. We decided to keep ui-corner-all and ui-btn-corner-all and override with border-(left|right|top|bottom)-radius: 0; where we don't want corners. You can also add ui-corner-all to an outer element, and synchronize the corners of elements inside the outer element with border-(left|right|top|bottom)-radius: inherit;. We do that with .ui-btn-inner elements.

This should be equivalent.
If this doesn't help you, please re-open this issue for discussion.



In addition to @gabrielschulhof his comment...

In previous versions the JS applied those corner classes. For performance we changed this to having the JS only apply the ui-corner-all or ui-btn-corner-all class. In the CSS we added rules to make child elements inherit the border-radius for the applicable corners.

If you used those classes for other elements you have to add them to your custom CSS. Note that you don't need the -moz prefixed property anymore. Two examples with the default radius of .6em:

.ui-corner-tl {
    -webkit-border-top-left-radius: .6em;   
    border-top-left-radius: .6em;
.ui-corner-bottom {
    -webkit-border-bottom-left-radius: .6em;    
    border-bottom-left-radius: .6em;
    -webkit-border-bottom-right-radius: .6em;   
    border-bottom-right-radius: .6em;

@toddparker - Should we mention this change in the 1.3 release blog post?

owais commented Jan 22, 2013

Great! Thanks guys.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment