pahiker
Joined: Thu Sep 13, 2012 2:43 pm Posts: 6
|
 Background colors not working
Sorry for two posts so soon together. I got PIE working for the most part, but I still have two issues left. This one is in regards to colors on my CSS buttons. The colors seem to be working in IE 7&8, but not in 9 or 10. Links to the screen shots are below, here is the CSS code: Code: /* HomeButton */ a.HomeButton, a.SwPaButton, a.NwPaButton, a.Testing { -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; float:left; font-family:sans-serif; font-size:14px; font-weight:100; text-decoration:none; padding:10px 25px; margin-bottom: 10px; margin-left: 5px; behavior:url(PIE.htc); }
/* HomeButton */ a.HomeButton { -moz-box-shadow:2px 2px 0 #8080C0; -webkit-box-shadow:2px 2px 0 #8080C0; box-shadow:2px 2px 0 #8080C0; background: -moz-linear-gradient(19% 75% 90deg, GREEN, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(GREEN)); color:black; border: 1px solid BLACK; behavior:url(PIE.htc); }
a.HomeButton:hover{ background: -moz-linear-gradient(19% 75% 90deg,#B2B2D9, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(#B2B2D9)); behavior:url(PIE.htc); }
/* SwPaButton */ a.SwPaButton{ -moz-box-shadow:2px 2px 0 BLACK; -webkit-box-shadow:2px 2px 0 BLACK; box-shadow:2px 2px 0 BLACK; background: -moz-linear-gradient(19% 75% 90deg, BLACK, DARKGRAY); background: -webkit-gradient(linear, left top, left bottom, from(DARKGRAY), to(BLACK)); color:GOLD; border: 1px solid BLACK; behavior:url(PIE.htc); }
a.SwPaButton:hover{ background: -moz-linear-gradient(19% 75% 90deg,#EED0EE, DARKGRAY); background: -webkit-gradient(linear, left top, left bottom, from(DARKGRAY), to(#EED0EE)); behavior:url(PIE.htc); }
/* NwPaButton */ a.NwPaButton{ -moz-box-shadow:2px 2px 0 #8080C0; -webkit-box-shadow:2px 2px 0 #8080C0; box-shadow:2px 2px 0 #8080C0; background: -moz-linear-gradient(19% 75% 90deg, MEDIUMBLUE, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(MEDIUMBLUE)); color:WHITE; border: 1px solid BLACK; behavior:url(PIE.htc); }
a.NwPaButton:hover{ background: -moz-linear-gradient(19% 75% 90deg,#B2B2D9, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(#B2B2D9)); behavior:url(PIE.htc); }
/* testing button */ a.Testing{ -moz-box-shadow:2px 2px 0 #8080C0; -webkit-box-shadow:2px 2px 0 #8080C0; box-shadow:2px 2px 0 #8080C0; background: -moz-linear-gradient(19% 75% 90deg, RED, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(RED)); color:black; border: 1px solid BLACK; behavior:url(PIE.htc); }
a.Testing:hover{ background: -moz-linear-gradient(19% 75% 90deg, PINK, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(PINK)); behavior:url(PIE.htc); }
/* waiting button */ a.Waiting{ -moz-box-shadow:2px 2px 0 #8080C0; -webkit-box-shadow:2px 2px 0 #8080C0; box-shadow:2px 2px 0 #8080C0; background: -moz-linear-gradient(19% 75% 90deg, ORANGE, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(ORANGE)); color:black; border: 1px solid BLACK; behavior:url(PIE.htc); }
a.Waiting:hover{ background: -moz-linear-gradient(19% 75% 90deg, YELLOW, #e2f2ff); background: -webkit-gradient(linear, left top, left bottom, from(#e2f2ff), to(YELLOW)); behavior:url(PIE.htc); }
/* Transparent */ a.Trans{ color:transparent; behavior:url(PIE.htc); }
http://browsershots.org/http://www.pahiker.com/FTFdev/
|