Skip to content

Upload button has different alignment #420

Description

@vaadin-bot

Originally by draken


Morning all,

Having a bit of annoying issue with some alighnment problems. First all this is using the following:

Vaadin 7.3.1
Touchkit 4.0.0
Touchkit style

So, we have a hortizontal button group inside a vertical layout. This button group has two buttons, a normal one and a Upload button that uses a ImageUploader and they are created like this:

public class ExtendsVerticalLayout extends VerticalLayout{

    private HorizontalButtonGroup buttonGroup;

    private void buildView(){
        Upload bttnUpload = new Upload();
        ImageUploader uploader = new ImageUploader(bttnUpload );
        bttnUpload .setReceiver(uploader);
        buttonGroup = new HorizontalButtonGroup();
        buttonGroup.addComponent(bttnUpload );
        Button bttnDeletePicture = new Button("Delete");
        bttnDeletePicture.setDisableOnClick(true);
        bttnDeletePicture.setIcon(FontAwesome.TRASH_O);
        buttonGroup.addComponent(bttnDeletePicture);
        addComponent(buttonGroup);
    }
}

However, this causes the attached image where the buttons are out of alignment. It would be lovely if we could get them both to behave the same way, since they look like buttons and both belong to the same button group. In the meantime, does anyone have a suggestion to fix it? Playing with the CSS, I did find removing the following style from the button (in .v-button class) almost fixes it:

overflow: hidden;


Imported from https://dev.vaadin.com/ issue #19707

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions