Having trouble getting help?
Contact Support
Contact Support
Enable rtl in React Button group component
30 Jan 20231 minute to read
ButtonGroup supports RTL functionality. This can be achieved by adding e-rtl
class to the target element.
The following example illustrates how to create ButtonGroup with RTL support.
import { ButtonComponent } from '@syncfusion/ej2-react-buttons';
import * as React from 'react';
import * as ReactDom from 'react-dom';
// To render ButtonGroup with RTL.
function App() {
return (<div>
<div className='e-btn-group e-rtl'>
<ButtonComponent>HTML</ButtonComponent>
<ButtonComponent>CSS</ButtonComponent>
<ButtonComponent>Javascript</ButtonComponent>
</div>
</div>);
}
export default App;
ReactDom.render(<App />, document.getElementById('buttongroup'));
import { ButtonComponent } from '@syncfusion/ej2-react-buttons';
import * as React from 'react';
import * as ReactDom from 'react-dom';
// To render ButtonGroup with RTL.
function App() {
return (
<div>
<div className='e-btn-group e-rtl'>
<ButtonComponent>HTML</ButtonComponent>
<ButtonComponent>CSS</ButtonComponent>
<ButtonComponent>Javascript</ButtonComponent>
</div>
</div>
);
}
export default App;
ReactDom.render(<App />,document.getElementById('buttongroup'));