Changing the Splitter Width

ComponentOne Splitter for ASP.NET AJAX: Splitter for ASP.NET AJAX Task-Based Help > Changing the Appearance of a C1Splitter Control > Changing the Splitter Width

You can easily widen the splitter bar using the Width property. In this topic, you will learn how to set the Width property in Design view, in Source view, and in code.

For more information on the splitter width, see Splitter Bar Width and Position.

In Design View

Complete the following steps:

1. Add C1Splitter to the Web form.

2. Right-click on the control to open its context menu and select Properties.

3. In the Properties window, click the Bar node to reveal the Width property.

4. Set the Width property to "40".

In Source View

To increase the width of the splitter bar, place <Bar Width="40" /> between the <cc1:C1Splitter> tag. Once the Width property has been set, the markup will resemble the following:

<cc1:C1Splitter ID="C1Splitter6" runat="server" Height="251px" Width="217px">

<Bar Width="40" />

</cc1:C1Splitter>

In Code

Complete the following steps:

1. Import the following namespace into your project:

• Visual Basic

Imports C1.Web.UI.Controls.C1Splitter

• C#

using C1.Web.UI.Controls.C1Splitter;

2. Add the following code to the Page_Load event to set the Width property:

• Visual Basic

C1Splitter1.Bar.Width = 40

• C#

C1Splitter1.Bar.Width = 40;

3. Run the program.

$Description: D:\Whidbey\T109\C1Splitter\WordDocuments\Other Graphics\10.png$ This topic illustrates the following:

The following image displays a horizontal C1Splitter with its Width property set to 40 pixels:

$Description: D:\Whidbey\T109\C1Splitter\WordDocuments\Graphics\SplitterWidth_Final.png$