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

Reduce left indent of radTreeView nodes?

7 Answers 295 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 09 Dec 2012, 12:14 AM
Hi, I really hate to have to keeping asking all these questions but I'm spinning my wheels on a treeview formatting issue.

How do you move the treenodes indent to the left closer to the black border (see attachment)? I've tried playing with the ul class and setting margin-left to 0px but with no effect.

I have the following css to hide the +/- expand icon, so it seems the space used by these images still remains.  I want  move everything left where they used to appear since I don't need them.

<style type="text/css">
    .RadTreeView_Default .rtPlus,
    .RadTreeView_Default .rtMinus
    {
        display: none!important;
    }
</style


Thanks again, Dave.

7 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 10 Dec 2012, 07:36 AM
Hi David,

Try overriding the default CSS as follows to achieve your scenario.

CSS:
<style type="text/css">
    .RadTreeView .rtUL .rtLI .rtUL
    {
        padding-left: 0px !important;
        margin-left: 0px !important;
    }
    .RadTreeView .rtTop, .RadTreeView .rtMid, .RadTreeView .rtBot
    {
        padding-left: 0px !important;
    }
</style>

Hope this helps.

Regards,
Shinu.
0
David
Top achievements
Rank 1
answered on 10 Dec 2012, 01:28 PM
Thanks for the reply.  I should have been more clear...I want move everything left once the +/- is removed but still keep the hierarchy.  The css you provided lists all the checkboxes along the left side.

0
Shinu
Top achievements
Rank 2
answered on 11 Dec 2012, 04:02 AM
Hi David,

Please try the following CSS.

CSS:
<style type="text/css">
    .RadTreeView .rtTop, .RadTreeView .rtMid, .RadTreeView .rtBot
    {
        padding-left: 0px !important;
    }
</style>

Hope this helps.

Regards,
Shinu.
0
David
Top achievements
Rank 1
answered on 11 Dec 2012, 02:12 PM
Thanks! that seemed to work.  Dave.
0
David
Top achievements
Rank 1
answered on 23 Jan 2013, 03:29 PM
Hi, I have a follow-up.  Can I take this further and reduce the child nodes some more? I attached a sample of what I have now vs how I'd like to further reduce indentation of the checkboxes nodes.  Thanks, Dave.

0
Shinu
Top achievements
Rank 2
answered on 24 Jan 2013, 04:36 AM
Hi David,

Try the following CSS to achieve your scenario.

CSS:
<style type="text/css">
    .RadTreeView .rtUL .rtLI .rtUL
    {
        padding-left: 10px !important;
    }
</style>

Hope this helps.

Regards,
Shinu.
0
David
Top achievements
Rank 1
answered on 24 Jan 2013, 12:57 PM
Thanks! just what I was looking for!  Dave.
Tags
TreeView
Asked by
David
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
David
Top achievements
Rank 1
Share this question
or