[SOLVED] Buttons: how to align an icon?

is there a class or property to align an icon inside a button to one of the side?
or i’ve to write a css float myself?

You should be able to do it with flexbox helper classes https://framework7.io/docs/typography.html#flexbox

Uhm… don’t think so, i wanted to keep the title in the center and just move the icon that i included on the buttons parameters not as a child element. So buttons does not have slots?

Would be good to see code examples of what you have tried and what you are trying to achieve

nevermind :slight_smile: while customing the toast i figured out that the best way is to use flex as row with center align on both axis and then just have the text to use flex-grow to push the icon on a side.

I wonder why there is so little info on the internet on this such good framework, i’m very enjoyining my first project with it.

The solution is to add the class display-flex to the button, then surround the text with a span that has a class that have flex-grow:1;

<Button type="submit" iconF7="enter_round" raised fill 
className="color-theme-lightblue display-flex" 
><span className="flex-grow">Sign In</span>