Horizontal scroll always appear

[Konrad Lowczak]

Hi

I have modal dialog with treeview control inside.

When text width of one of the treeview items is longer than width of modal dialog - horizontal scroll bar appears in the bottom of treeview component.

How can I set width of treeview component and avoid showing horizontal scroll bar?

Right now it looks like this:

My purpose is behaviour like this:

PS:

Don't worry about '...'. We have component to handle this case.

Thanks Konrad

[Ashokkumar Balasubramanian]

Hi Konrad Lowczak, 

 

Good day to you. 

 

We have validated your requirement and can able to achieve this using the following styles. 

 

    /*customTree is a cssClass for TreeView*/ 

    .customTree li .e-list-text { 

        display: inline-block; 

        width: 12em; 

        overflow: hidden; 

        white-space: nowrap; 

        text-overflow: ellipsis; 

    } 

 

Sample: https://codesandbox.io/s/vue-template-m9lzc 

 

Kindly check the above sample and get back to us if you need any further assistance. 

 

Regards, 

Ashokkumar B. 

[Konrad Lowczak]

Thank You for Your help. It works.

Best regards

Konrad

[Ashokkumar Balasubramanian]

Hi Konrad Lowczak,  

 

We are glad to hear that the problem has been resolved. Please let us know, if you need any further assistance. 

 

Regards, 

Ashokkumar B.