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

networking - Vagrant-provisioned VirtualBox VM is not reachable from Ubuntu host -

c# - ASP.NET Core - There is already an object named 'AspNetRoles' in the database -

ruby on rails - ArgumentError: Missing host to link to! Please provide the :host parameter, set default_url_options[:host], or set :only_path to true -