Fileupload styling

asked 2021-10-28 21:02:16 +0800

jgomer2001 gravatar image jgomer2001
80 4

updated 2021-10-28 21:14:26 +0800

Hi team,

Using here. If I do:

Fileupload.get( map, "Choose a file: ", "Upload files", null 10,
true, new EventListener<uploadevent>() { ... } )

The upload window appears. Is there a way to quick-style that window a bit? The list of files selected so far does not look very good. Particulary it has no vertical padding so there is no space between the bottom of the list and the Upload/Cancel buttons.

Kind regards.

delete flag offensive retag edit

1 Answer

Sort by ยป oldest newest most voted

answered 2021-11-02 12:02:13 +0800

cor3000 gravatar image cor3000
6280 2 7

updated 2021-11-02 12:07:22 +0800

The default dialog doesn't contain any specific css classes for easy styling. What can do is define your own upload dialog template


To start with you can use the default dialog template from withing zul.jar fileuploaddlg.zul

And add a css class (or inline style) to line 32

e.g. this:

<div id="uploaded" visible="false" sclass="uploaded-files"></div>

Then you can define a top/bottom margin for this div element:

.uploaded-files {
    margin: 10px 0;

related FR: ZK-5053

link publish delete flag offensive edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

1 follower



Asked: 2021-10-28 21:02:16 +0800

Seen: 7 times

Last updated: Nov 02 '21

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More