Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #111684

    I need to create some small (30px) flat buttons with only an icon inside but centered.

    I didn’t find any property to do that.

    how can I do ?

    Tks

    #111708
    admin
    Keymaster

    Please, refer to this sample with small buttons and icons: https://www.htmlelements.com/demos/button/basic/

    Regards,
    Markov

    Smart UI Team
    https://www.htmlelements.com/

    • This reply was modified 3 days, 20 hours ago by admin.
    #111710

    In that sample I see some buttons smaller than others, however I don’t see any way to control dimensions.

    My need is to have button smaller than buttons shown in that example.

    Also change the background color is a need.

    Tks

    #111714
    admin
    Keymaster

    Hi,

    The size of the buttons is set through CSS. In CSS you have width and height properties which determine the size of the Button and any other HTML Element. For example, the round button in the sample is 48px. If you set it to 30px through CSS, it will be 30px.

    Regards,
    Markov

    Smart UI Team
    https://www.htmlelements.com/

    #111719

    I tried and I reduced the size using (cfg-button-inline is my class)
    smart-button.cfg-button-inline {

    height :24px;

    width:25px;

    }
    Now I see the correct size of the button but the icon is visible only partially in the bottom right corner.

    Inspecting the page I saw the internal <button> tag still have a 32×32 size.

    Tks

     

    #111744

    Also using material icons the icon is shown only partially in the lower right corner.

    What’s wrong ?

    Tks

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.