This is a migrated thread and some comments may be shown as answers.

How to apply styles to the k-upload-files class

1 Answer 1069 Views
Upload
This is a migrated thread and some comments may be shown as answers.
JoJo
Top achievements
Rank 1
JoJo asked on 04 Jan 2013, 02:59 PM
Hi, 

I want to set the height and width of the element "ul" so that when i select multiple files they all come in one column. Right now they are getting scattered when i select 10 files.

I tried to set the height and width of the for the class "k-upload-files k-reset" in the onSelect event. But the ul is not created by the time i tried to apply the styles. so no effect.
How can set the styles for the ul element (k-upload-files k-reset) ?

Thanks. 

1 Answer, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 07 Jan 2013, 02:45 PM
Hello Suresh,

The Upload filenames' visibility and layout and depend on the following styles:

.k-filename {
    display: inline-block;
    min-width: 120px;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

The above rule is in kendo.common.css. Feel free to edit or override any of the above styles, so that the Upload has the desired appearance. In order to override the above styles, you need a CSS selector with a higher specificity (for example ".k-upload .k-filename").

Please note that the only reliable way to have each file name on a separate line (if the filenames have different length) is to use asynchronous upload:

http://demos.kendoui.com/web/upload/async.html

Regards,
Dimo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Upload
Asked by
JoJo
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Share this question
or