发表新帖
发表新帖

Bootstrap 3 Styled Select dropdown looks ugly in Firefox on OS X

前端 未结
关注
12 2108
小蘑菇
小蘑菇 2021-01-30 00:42

When styling a form

提交评论
  •  加载中...
  • 失恋的感觉
    2021-01-30 01:18

    I am using Chosen. Look at: http://harvesthq.github.io/chosen/

    It works on Firefox, Chrome, IE and Safari with the same style. But not on Mobile Devices.

    0 讨论(0)
  • 梦谈多话
    2021-01-30 01:25

    With Bootstrap 4+, you can simply add the class custom-select for your select inputs to drop the browser-specific styling and keep the arrow icons.

    Documentation Here: Bootstrap 4 Custom Forms Select Menu

    0 讨论(0)
  • 礼貌的吻别
    2021-01-30 01:26

    I found two potential ways of solving this specific problem:

    1. Use Chosen

    2. Target mozilla browsers using @-moz-document url-prefix() like so:

    @-moz-document url-prefix() {
  select {
    padding: 5px;
  }
}
    0 讨论(0)
  • 挽巷
    2021-01-30 01:27

    You can use jquery.chosen or bootstrap-select to add style to your buttons.Both work great. Caveat for Using Chosen or bootstrap-select: they both hide the original select and add in their own div with its own ID. If you are using jquery.validate along with this, for instance, it wont find the original select to do its validation on because it has been renamed.

    0 讨论(0)
  • 爱一瞬间的悲伤
    2021-01-30 01:30

    You can actually change the grey box around the dropdown arrow in IE:

            select::-ms-expand {
            width:12px;
            border:none;
            background:#fff;
        }

    enter image description here

    0 讨论(0)
    • 上一页 1 2
     看不清?
    提交回复
    热议问题