Textarea has double top border #6839

Closed
DzenisevichK opened this Issue Dec 24, 2013 · 3 comments

2 participants

@DzenisevichK

Reproduced on iOS 7.0.4 (iPhone 4G):

http://jsbin.com/ekenOxa/9/

I disabled shadow and radius in example to be more obvious.
It seems that

/* Body: Read-only lists, text inputs, collapsible content */
.ui-body-a,
.ui-page-theme-a .ui-body-inherit,
html .ui-bar-a .ui-body-inherit,
html .ui-body-a .ui-body-inherit,
html body .ui-group-theme-a .ui-body-inherit,
html .ui-panel-page-container-a {
    background:             #fff /*{a-body-background-color}*/;
    border-color:           #ddd /*{a-body-border}*/;
    color:                  #333 /*{a-body-color}*/;
    text-shadow: 0 /*{a-body-shadow-x}*/ 1px /*{a-body-shadow-y}*/ 0 /*{a-body-shadow-radius}*/     #f3f3f3 /*{a-body-shadow-color}*/;
}

css rules implicitly set background-clip to initial that overrides

/* Radius clip workaround for cleaning up corner trapping */
.ui-btn-corner-all,
.ui-corner-all {
    -webkit-background-clip: padding;
    background-clip: padding-box;
}

css rule where background-clip defined to padding-box

@DzenisevichK

Fixed locally by:

/* Radius clip workaround for cleaning up corner trapping */
.ui-btn-corner-all,
.ui-corner-all {
    -webkit-background-clip: padding !important; /* Increase priority to prevent overriding it by background style in theme swatches */
    background-clip: padding-box !important;
}

It seems hard to avoid important in this case...

@jaspermdegroot
jQuery Foundation member

@DzenisevichK

Thanks. Maybe we can change background to background-color to prevent the override. Have to see if that won't cause issues. Otherwise your solution is probably the best.

@DzenisevichK

Yes, indeed, background-color is better solution... Necessary to check

@jaspermdegroot jaspermdegroot modified the milestone: 1.4.2, 1.4.1 Feb 12, 2014
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment