Kendo Upload widget issue

[Lingampally]

I am using Kendo JSP upload tag to upload files in my page. When i use Kendo upload button without any styles, it is not coming next to my file to upload label and it is displayed in the bottom of file to upload label. I want both file to upload and select file button align in the same line (please check the attachment). when i add the styles to kendo upload button, which changes the display of other input fields in my page. One more thing, when i use this button i am not able to see the file i selected, which comes default when their is no styles (please see uploadPage.PNG file). But when i add 

.k-upload{
    display: inline-block;
    min-width: 26em;
    max-width: 26em;
    max-height: 3em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}    

this css class, it is not showing the file i selected. I want both file to upload and select file in the same line and show the file i selected inside the select file box by restricting user to upload 1 file at a time. Please help me on this, as i am newbie to kendo.

Please specify is their any reference which we can use to align kendo upload button properly with other buttons and labels by changing its default width/height.

 

Thanks,

Srujana

 

 

 

 

[Veselin Tsvetanov]

Hello Srujana,

In order to display the Upload widget wrapper on the same line as its label, you will need to set its display CSS property to inline-block:

.k-upload {
        display: inline-block;
        max-height: 116px;
      }

With the above, you will also notice, that I have set a max-height for the wrapper.

Here you will find a simple Dojo, implementing the above suggestion.

Regards,
Veselin Tsvetanov
Progress Telerik