我在下面提到的链接这是语义UI在React,我想删除侧菜单和标签内容语义UI沙箱链接之间的空格:https://z3omnz.csb.app/当前外观:
想此式:
ttp71kqs1#
使用基本的CSS,但您甚至可以使用样式化组件等。在Tab中添加一个类名并导入一个CSS文件。
import React from 'react' import { Tab } from 'semantic-ui-react' import "./tabStyle.css" const panes = [ { menuItem: 'Tab 1', render: () => <Tab.Pane>Tab 1 Content</Tab.Pane> }, { menuItem: 'Tab 2', render: () => <Tab.Pane>Tab 2 Content</Tab.Pane> }, { menuItem: 'Tab 3', render: () => <Tab.Pane>Tab 3 Content</Tab.Pane> }, ] const TabExampleMenuPositionRight = () => ( <Tab menu={{ fluid: true, vertical: true }} menuPosition='right' panes={panes} className="styledTab" /> ) export default TabExampleMenuPositionRight
在tabStyle.css中使用以下代码,该代码将针对由semantic-ui-react -
.styledTab .ui.grid>.column:not(.row) { padding-right: 0px !important; padding-left: 0px !important; }
1条答案
按热度按时间ttp71kqs1#
使用基本的CSS,但您甚至可以使用样式化组件等。
在Tab中添加一个类名并导入一个CSS文件。
在tabStyle.css中使用以下代码,该代码将针对由semantic-ui-react -