New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Radio buttons are partially (half) visible behind the labels #5740

Closed
adam-ah opened this Issue Mar 7, 2013 · 6 comments

Comments

Projects
None yet
3 participants
@adam-ah

adam-ah commented Mar 7, 2013

This is the code I use:

<ul data-role="listview" data-inset="true">
    <li>
        <h3>{$text}</h3>
        <div>
            <fieldset data-role="controlgroup" data-type="horizontal">
                <input id="{$id}-no" name="{$id}-group" value="No" type="radio">
                <label for="{$id}-no">No</label>
                <input id="{$id}-yes" name="{$id}-group" value="Yes" type="radio">
                <label for="{$id}-yes">Yes</label>
            </fieldset>
        </div>
    </li>
</ul>

The physical radio buttons are half visible behind the label covers.

Android 2.3.3, default browser.
Desktop Chrome is all okay.
Photo on 7-03-13 at 7 01 PM

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Mar 7, 2013

Member

@adam-ho

Did you test with latest code? I couldn't reproduce the issue on Android 2.3 http://jsbin.com/atarer/2

Member

jaspermdegroot commented Mar 7, 2013

@adam-ho

Did you test with latest code? I couldn't reproduce the issue on Android 2.3 http://jsbin.com/atarer/2

@adam-ah

This comment has been minimized.

Show comment
Hide comment
@adam-ah

adam-ah Mar 7, 2013

I've downloaded the jquery.mobile-1.3.0.zip package and using the uncompressed JS and uncompressed CSS.
Hitting the above test link with the mobile seems to be good, no issues.
If cannot reproduce using the zip, I'll try to narrow down the problem to see which components together cause the issue.
(btw, I'm adding the controls dynamically and calling .trigger('create') but that should not matter much. On a desktop browser the page looks perfect).

adam-ah commented Mar 7, 2013

I've downloaded the jquery.mobile-1.3.0.zip package and using the uncompressed JS and uncompressed CSS.
Hitting the above test link with the mobile seems to be good, no issues.
If cannot reproduce using the zip, I'll try to narrow down the problem to see which components together cause the issue.
(btw, I'm adding the controls dynamically and calling .trigger('create') but that should not matter much. On a desktop browser the page looks perfect).

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Mar 7, 2013

Member

@adam-ho

It could be that this was an issue in 1.3 stable, but has been fixed already in latest code (which means it will be fixed in 1.3.1). See links in the head of the JS Bin test page (http://jsbin.com/atarer/2/edit) to test your app with latest code.
Did you wrap the radio buttons in a <form> in your app? If not, you could check if that prevents the issue when using 1.3.0.
I am closing this issue as cannot reproduce / already fixed. If you still see an issue when you test your app with latest, please provide a JS Bin test page that shows the problem and we re-open.

Member

jaspermdegroot commented Mar 7, 2013

@adam-ho

It could be that this was an issue in 1.3 stable, but has been fixed already in latest code (which means it will be fixed in 1.3.1). See links in the head of the JS Bin test page (http://jsbin.com/atarer/2/edit) to test your app with latest code.
Did you wrap the radio buttons in a <form> in your app? If not, you could check if that prevents the issue when using 1.3.0.
I am closing this issue as cannot reproduce / already fixed. If you still see an issue when you test your app with latest, please provide a JS Bin test page that shows the problem and we re-open.

@adam-ah

This comment has been minimized.

Show comment
Hide comment
@adam-ah

adam-ah Mar 7, 2013

I think I've managed to isolate the problem, added the 'demo' to http://jsbin.com/atarer/3/edit
The mini display in not correct, the normal is all okay.

adam-ah commented Mar 7, 2013

I think I've managed to isolate the problem, added the 'demo' to http://jsbin.com/atarer/3/edit
The mini display in not correct, the normal is all okay.

@jaspermdegroot jaspermdegroot reopened this Mar 7, 2013

@mrextreme

This comment has been minimized.

Show comment
Hide comment
@mrextreme

mrextreme Mar 11, 2013

I also see it with stock Android 2.3.4 browser on SE xPeria Arc, and stock browser in Android 2.3.7 (CM 7.2) on Samsung Galaxy Ace. I also see the right edge of the underlying rightmost radio button with stock Android 4.0.4 browser on SE xPeria Arc S. It looks ok with stock Android 4.0.4 browser on Samsung Galaxy Note (GT-N7000).

mrextreme commented Mar 11, 2013

I also see it with stock Android 2.3.4 browser on SE xPeria Arc, and stock browser in Android 2.3.7 (CM 7.2) on Samsung Galaxy Ace. I also see the right edge of the underlying rightmost radio button with stock Android 4.0.4 browser on SE xPeria Arc S. It looks ok with stock Android 4.0.4 browser on Samsung Galaxy Note (GT-N7000).

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Mar 18, 2013

Member

I was able to reproduce the issue (Android 2.3.5). I wonder if it's the same as #5728

Member

jaspermdegroot commented Mar 18, 2013

I was able to reproduce the issue (Android 2.3.5). I wonder if it's the same as #5728

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