[SOLVED] Buttons: how to align an icon?

Questions
1

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?

2

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

3

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?

4

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

5

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.

6

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>
</Button>