Angular Button - Change Icon Position
To align an icon to the right, assign true
to the rtlEnabled property:
jQuery
index.js
$(function() {
$("#button").dxButton({
// ...
icon: "comment",
rtlEnabled: true
});
});
Angular
app.component.html
<dx-button ...
icon="comment"
[rtlEnabled]="true">
</dx-button>
Vue
App.vue
<template>
<DxButton ...
icon="comment"
:rtl-enabled="true"
/>
</template>
React
App.js
// ...
function App() {
return (
<Button ...
icon="comment"
rtlEnabled={true}
/>
);
}
export default App;
To align an icon to any other position, use CSS rules. For example:
CSS
.dx-button .dx-icon { padding-left: 15px; }
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.