html - Same classes applied to anchor tag IE 11 generates two different background images -


i applying same classes 2 different elements , generated background property different.

i ending button 1 - rgba(0, 0, 0, 0) linear-gradient(rgb(0, 81, 0) 0%, rgb(36, 138, 30) 100%) repeat scroll 0% 0% / auto padding-box border-box

button 2 - rgba(0, 0, 0, 0) linear-gradient(rgb(36, 138, 30) 0%, rgb(0, 81, 0) 100%) repeat scroll 0% 0% / auto padding-box border-box

i not understand why 2 different values generated using same class.

this background property class looks like: background: linear-gradient(to bottom, #248a1e 0%,#005100 100%);

so ending 1 button renders way expect , other button looks 1 on post crossbrowser css gradient in ie10, ie11.

you using 2 classes same button. last css rendered. style "contact-button" overridden style of class "green-button". use !important not overridden properties this.

    .green-button {                 text-align: center;                 color: #fff;                 border: 1px solid #016d01;                 font-size: 14px;                 font-weight: bold;                 padding: 8px 14px 8px 14px;                 background: #52b152;                 background: linear-gradient(to bottom, #248a1e 0%,#005100 100%) !important;                 border-radius: 4px;             } 

Comments

Popular posts from this blog

html - How to set bootstrap input responsive width? -

javascript - Highchart x and y axes data from json -

javascript - Get js console.log as python variable in QWebView pyqt -