如何在菜单下拉react-select中删除顶部和底部的填充?

罗纳尔多

我已经根据此处给出的答案进行了尝试:如何在菜单下拉react-select中删除padding-top?但这对我不起作用。该空间还比https://react-select.com/styles上的大多数示例都大很遗憾,我无法检查元素的下拉列表,以查看发生了什么问题。

我的代码:

const stateOptions = [
     { value: 'All', label: 'ALL' },
      { value: 'SELECT1', label: 'SELECT1' },
      { value: 'SELECT2', label: 'SELECT2' },
      { value: 'SELECT3', label: 'SELECT3' }
  ]

  const options = [
    {
      options: stateOptions
    }
  ]

  const customStyles = {
    menu: provided => ({
      ...provided,
      marginTop: 0,
      width: '100%',
      marginTop: '-1px',
      
    }),
    menuList: (provided, state) => ({
      ...provided,
      paddingTop: 0,
      paddingBottom: 0,
      overflow: 'hidden',
    }),
    option: (provided, state) => ({
      ...provided,
      height: '55px',
      borderBottom: '1px solid #b0b0b0',
      color: state.isSelected ? 'white' : '#000000',
      background: state.isSelected ? '#e3155c' : 'white',
      fontFamily: 'Qanelas-Regular',
      fontSize: '16px',
      padding: '15px',
      ':hover': {
        ...provided[':active'],
        backgroundColor: '#e3155c',
        color: 'white'
      },
    }),
阿波斯托洛斯

真正为我工作的是以下内容:

group: provided => ({
  ...provided,
  paddingTop: 0,
}),

试图检查代码的黑客是按下F8以便暂停脚本执行。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在 MathJax 中删除数学的顶部/底部填充?

来自分类Dev

如何在React-native中创建下拉菜单?

来自分类Dev

如何在Mac OS中从SwiftUI列表中删除底部/顶部项目填充

来自分类Dev

React - 如何在 Select Material UI 中自定义下拉菜单

来自分类Dev

如何删除Android复选框的内部图像填充(顶部,左侧和底部)

来自分类Dev

如何从android.support.v7.widget.Toolbar删除顶部和底部填充?

来自分类Dev

如何删除Android复选框的内部图像填充(顶部,左侧和底部)

来自分类Dev

如何在菜单和下拉菜单之间添加空格

来自分类Dev

如何在React中创建带有变体下拉菜单的产品页面?

来自分类Dev

如何在我的 React 导航栏中实现汉堡包下拉菜单

来自分类Dev

如何在 React Native 中禁用材质 UI 下拉菜单?

来自分类Dev

如何在MaterializeCSS下拉菜单中创建子菜单?

来自分类Dev

如何在当前菜单中创建下拉菜单

来自分类Dev

如何在cakephp中填充下拉菜单?

来自分类Dev

如何在视图页面中填充下拉菜单?

来自分类Dev

如何在React中使用“ react-bulma-components”设置下拉按钮和下拉菜单的宽度,以使其宽度填充父div?

来自分类Dev

我们如何在fullPage.js中为差异部分设置不同的填充顶部和底部值?

来自分类Dev

如何删除UWP应用程序中ComboBox项目列表顶部和底部的边距设置

来自分类Dev

如何在ASP.NET Core MVC的其他下拉菜单中根据用户选择填充下拉菜单?

来自分类Dev

如何在Bootstrap的项目菜单中创建子菜单下拉菜单?

来自分类Dev

如何在PHP中插入多个下拉菜单的值

来自分类Dev

我如何在引导下拉菜单中添加图标

来自分类Dev

如何在Zurb Foundation下拉菜单中添加溢出?

来自分类Dev

如何在ActionBar中右对齐导航下拉菜单?

来自分类Dev

如何在IE的下拉菜单中验证所选选项

来自分类Dev

如何在下拉菜单中获得独特的价值

来自分类Dev

如何在WP中制作这样的水平下拉菜单

来自分类Dev

如何在与字典绑定的Propertygrid中显示下拉菜单

来自分类Dev

如何在下拉菜单中显示时区偏移

Related 相关文章

  1. 1

    如何在 MathJax 中删除数学的顶部/底部填充?

  2. 2

    如何在React-native中创建下拉菜单?

  3. 3

    如何在Mac OS中从SwiftUI列表中删除底部/顶部项目填充

  4. 4

    React - 如何在 Select Material UI 中自定义下拉菜单

  5. 5

    如何删除Android复选框的内部图像填充(顶部,左侧和底部)

  6. 6

    如何从android.support.v7.widget.Toolbar删除顶部和底部填充?

  7. 7

    如何删除Android复选框的内部图像填充(顶部,左侧和底部)

  8. 8

    如何在菜单和下拉菜单之间添加空格

  9. 9

    如何在React中创建带有变体下拉菜单的产品页面?

  10. 10

    如何在我的 React 导航栏中实现汉堡包下拉菜单

  11. 11

    如何在 React Native 中禁用材质 UI 下拉菜单?

  12. 12

    如何在MaterializeCSS下拉菜单中创建子菜单?

  13. 13

    如何在当前菜单中创建下拉菜单

  14. 14

    如何在cakephp中填充下拉菜单?

  15. 15

    如何在视图页面中填充下拉菜单?

  16. 16

    如何在React中使用“ react-bulma-components”设置下拉按钮和下拉菜单的宽度,以使其宽度填充父div?

  17. 17

    我们如何在fullPage.js中为差异部分设置不同的填充顶部和底部值?

  18. 18

    如何删除UWP应用程序中ComboBox项目列表顶部和底部的边距设置

  19. 19

    如何在ASP.NET Core MVC的其他下拉菜单中根据用户选择填充下拉菜单?

  20. 20

    如何在Bootstrap的项目菜单中创建子菜单下拉菜单?

  21. 21

    如何在PHP中插入多个下拉菜单的值

  22. 22

    我如何在引导下拉菜单中添加图标

  23. 23

    如何在Zurb Foundation下拉菜单中添加溢出?

  24. 24

    如何在ActionBar中右对齐导航下拉菜单?

  25. 25

    如何在IE的下拉菜单中验证所选选项

  26. 26

    如何在下拉菜单中获得独特的价值

  27. 27

    如何在WP中制作这样的水平下拉菜单

  28. 28

    如何在与字典绑定的Propertygrid中显示下拉菜单

  29. 29

    如何在下拉菜单中显示时区偏移

热门标签

归档