Skip to content

Upload button has different alignment #420

@vaadin-bot

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