List width exceeding the container boundary

edited January 11 in Technical questions

Hi,

My application has two tabs with a certain boundary height and width.
The second tab is having a list with width 1000 declared as type.
Due to that long width list whenever I click on the tab, the tab boundary gets exceeded which I do not want.

How can I declare the list so that even it has a long width, it remains within the tab size as same as the first tab and I scroll inside that tab only.

Snippet: https://webix.com/snippet/b67da517

How can I address this issue ?
Thanks.

Note: I am populating the list later on with some images $$("list").parse.
The width in this snippet I have put as 1000 to demonstrate the problem, in actual scenario it is only 300 which is causing the issue.

Tagged:

Comments

  • Hello!
    You used xCount, that is mean an exact size depending on the width of the elements.
    It's better to use scroll:"x", or use 'list' with ui.scrollview
    Here is an example: https://webix.com/snippet/40b94512

  • Thanks Nastja.
    I think my application has some special css settings so removing xCount is actually reducing the tab size.

    Could you please show me a demo of how can I use scrollview here and use it as a list ?

    Thanks again.

  • edited January 12

    You are welcome!
    As your application has some special css settings, I just admit that in this case it's better not to set dimensions for components and their items (but it's suitable for items inside template).
    In addition, information about Sizing Components is here
    Example of how you can use scrollview with 'list': https://webix.com/snippet/a498a46e

  • Thanks a lot for your kind effort.
    It is working.
    Still I will go through the Sizing Components page and let you know if I face any issue.

Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!