Make selectbox's style more consistence among all browsers

This commit is contained in:
Hadi Nategh 2016-09-14 11:19:31 +02:00
parent c7b6472a96
commit 5fa0d4dc5a
4 changed files with 48 additions and 42 deletions

View File

@ -2626,7 +2626,8 @@ div.client_error_log tr td.stack > div {
* ######################################################################################## * ########################################################################################
*/ */
body, body,
textarea { textarea,
button {
font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif; font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
} }
#egw_fw_basecontainer { #egw_fw_basecontainer {
@ -2696,6 +2697,16 @@ div.selectbox-wrapper ul li {
} }
select { select {
position: relative; position: relative;
padding-right: 20px !important;
-webkit-appearance: none;
-moz-appearance: none;
margin: 0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
/*IE has no appearance but we can remove arrows by ms-expand*/
select::-ms-expand {
display: none;
} }
select, select,
input, input,
@ -2792,15 +2803,6 @@ table.table_passord_change tr {
table.table_passord_change td:first-child { table.table_passord_change td:first-child {
padding-right: 4em; padding-right: 4em;
} }
@media screen and (-webkit-min-device-pixel-ratio: 0) {
select {
padding-right: 20px !important;
-webkit-appearance: none;
margin: 0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
}
/** /**
* EGroupware: Stylite Pixelegg template * EGroupware: Stylite Pixelegg template
* *

View File

@ -2615,7 +2615,8 @@ div.client_error_log tr td.stack > div {
* ######################################################################################## * ########################################################################################
*/ */
body, body,
textarea { textarea,
button {
font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif; font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
} }
#egw_fw_basecontainer { #egw_fw_basecontainer {
@ -2685,6 +2686,16 @@ div.selectbox-wrapper ul li {
} }
select { select {
position: relative; position: relative;
padding-right: 20px !important;
-webkit-appearance: none;
-moz-appearance: none;
margin: 0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
/*IE has no appearance but we can remove arrows by ms-expand*/
select::-ms-expand {
display: none;
} }
select, select,
input, input,
@ -2781,15 +2792,6 @@ table.table_passord_change tr {
table.table_passord_change td:first-child { table.table_passord_change td:first-child {
padding-right: 4em; padding-right: 4em;
} }
@media screen and (-webkit-min-device-pixel-ratio: 0) {
select {
padding-right: 20px !important;
-webkit-appearance: none;
margin: 0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
}
/** /**
* EGroupware: Stylite Pixelegg template * EGroupware: Stylite Pixelegg template
* *

View File

@ -25,7 +25,8 @@
body, body,
textarea { textarea,
button {
.basefontfamily; .basefontfamily;
} }
@ -96,8 +97,17 @@ div.selectbox-wrapper {
select { select {
position:relative; position:relative;
padding-right: 20px !important;
-webkit-appearance:none;
-moz-appearance: none;
margin:0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
/*IE has no appearance but we can remove arrows by ms-expand*/
select::-ms-expand {
display: none;
} }
select,input,button select,input,button
{ {
.color_100_gray; .color_100_gray;
@ -201,13 +211,3 @@ table.table_passord_change {
} }
/////* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
@media screen and (-webkit-min-device-pixel-ratio:0) {
select {
padding-right: 20px !important;
-webkit-appearance:none;
margin:0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
}

View File

@ -2637,7 +2637,8 @@ div.client_error_log tr td.stack > div {
* ######################################################################################## * ########################################################################################
*/ */
body, body,
textarea { textarea,
button {
font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif; font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
} }
#egw_fw_basecontainer { #egw_fw_basecontainer {
@ -2707,6 +2708,16 @@ div.selectbox-wrapper ul li {
} }
select { select {
position: relative; position: relative;
padding-right: 20px !important;
-webkit-appearance: none;
-moz-appearance: none;
margin: 0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
/*IE has no appearance but we can remove arrows by ms-expand*/
select::-ms-expand {
display: none;
} }
select, select,
input, input,
@ -2803,15 +2814,6 @@ table.table_passord_change tr {
table.table_passord_change td:first-child { table.table_passord_change td:first-child {
padding-right: 4em; padding-right: 4em;
} }
@media screen and (-webkit-min-device-pixel-ratio: 0) {
select {
padding-right: 20px !important;
-webkit-appearance: none;
margin: 0;
background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
background-size: 16px auto;
}
}
/** /**
* EGroupware: Stylite Pixelegg template * EGroupware: Stylite Pixelegg template
* *