Set Panelbar Template width

[King Wilder]

I'm using a Template inside the Panelbar control and the content goes off the page to the right without automatically wrapping to the width of the browser.

I've looked at all the examples and I can't see how to set the width.  Can you tell me what I'm doing wrong?

I've included my code:

    <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Skin="Telerik" Width="1000px">
        <CollapseAnimation Type="None" Duration="100"></CollapseAnimation>
        <Items>
            <telerik:RadPanelItem runat="server" Text="Order Details Description (Click here)"
                Expanded="false">
                <Items>
                    <telerik:RadPanelItem>
                        <ItemTemplate>
                            <div style="width: 1000px; float: left;">
                                <p>
                                    The Tabs are in order of importance, from left to right.</p>
                                <p>
                                    This is a brief explanation of how the order process flows. It only takes the four
                                    (4) steps below to start, process and complete an order.
                                </p>
                                <ol>
                                    <li><b>Order Tab</b> - View the information and status of the order. You do NOT need
                                        to manually change the Order Status, this is done automatically as long as the process
                                        follows these steps. If there is any change in the order process, you have the ability
                                        to override this and change the status manually.</li>
                                    <li><b>Files Tab</b> - Download the files for production. Click the file name to download
                                        the file.</li>
                                    <li><b>Vendor Jobs Tab</b> - Set a Vendor to handle an item or items.
                                        <ul>
                                            <li>Select a Vendor from the drop down list. <b>(Required)</b></li>
                                            <li>enter a PO, if applicable.</li>
                                            <li>enter the Date the item is dropped off to the Vendor. <b>(Required)</b></li>
                                            <li>enter a description if needed.</li>
                                            <li>select at least one item from the list on the right of items assigned to this Vendor.</li>
                                            <li>set the job status.</li>
                                            <li>Click the Save button. This will save the Vendor job for the selected item(s).</li>
                                        </ul>
                                        Note: You won't be able to add a Shipping Tracking Number (on the Shipping Tab)
                                        until at least one item receives a Pick Up/Delivery Date and the Job Status is "Ok
                                        to Ship"! (To set the Vendor Job Order Status, click the &quot;Vendor Job Status&quot;
                                        link in the left hand navigation, then edit the statuses until they are how you
                                        want them.)
                                        <br />
                                        <b>To Set a Pick Up / Delivery Date:</b>
                                        <ol>
                                            <li>When a job from a Vendor is completed and received, click the &quot;Edit&quot; link
                                                in the Job History table. The information for this job will appear in the fields.
                                                Select the Pick Up date and click the Save button. This will update the record for
                                                this job.</li>
                                        </ol>
                                    </li>
                                    <li><b>Shipping Tab</b> - this is the final step to completed an order. After a job
                                        has a Pick Up / Delivery Date, those items that are completed can be shipped. This
                                        section allows you to ship a partial order or the complete order, in case not all
                                        items are back from Vendors.
                                        <p>
                                            <b>To Ship an item(s):</b></p>
                                        <ol>
                                            <li>You must first get the shipping process started in order to get a Tracking number.</li>
                                            <li>Once you receive the Tracking number, enter it into the Shipping Tracking Number
                                                field and select the item(s) that will be shipped for this tracking number.</li>
                                            <li>Click the Set Tracking Number button. This will update the database with the tracking
                                                information for the selected item(s) which will be shown in the table below, it
                                                will update the Order Status and send an email to the customer that a full or partial
                                                order has shipped. It will automatically update the Order Status based on the number
                                                of items shipped. If only some of the items are shipped, it will set the Order Status
                                                to: &quot;Shipping Order&quot;. If all the items are shipped, then the Order Status
                                                is set to: &quot;Shipped To Customer&quot;.</li>
                                        </ol>
                                    </li>
                                </ol>
                                <p>
                                    The rest of this information is not part of the order completion process.</p>
                                <ul>
                                    <li><b>Billing Tab</b> - The billing area shows the order billing information and it
                                        gives you the ability to Refund the order. NOTE: Refunds can only be made by Administrators
                                        and an alert will be displayed when the order is &quot;In Production&quot; or any
                                        status past this. This is just to let you know that it's up to you if you want to
                                        refund the order after it's in production.</li>
                                    <li><b>Customer Tab</b> - The customer area allows you to update customer information
                                        and view the order history for a customer.</li>
                                    <li><b>Notes Tab</b> - This section allows you to add any notes for this order. Some
                                        notes are automatically entered by the application during the customer checkout
                                        process. You do not have the ability to edit or delete notes.</li>
                                    <li><b>Receipt Tab</b> - This is a copy of the receipt that the customer received after
                                        their order was completed.</li>
                                    <li><b>Audit Tab</b> - This just displays a trace record of events that occurred during
                                        the order checkout process. If there was an error during checkout, it would display
                                        here also.</li>
                                </ul>
                            </div>
                        </ItemTemplate>
                    </telerik:RadPanelItem>
                </Items>
            </telerik:RadPanelItem>
        </Items>
        <ExpandAnimation Type="None" Duration="100"></ExpandAnimation>
    </telerik:RadPanelBar>

[Paul]

Hello King Wilder,

You can easily achieve your goal by adding the following style to the DIV container:

....
<telerik:RadPanelItem>
    <ItemTemplate>
        <div style="width: 1000px; float: left; white-space:normal">
            <p>
....

Kind regards,
Paul
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[King Wilder]

Paul,

Thanks, that was it.  I didn't see this value anywhere in the examples.

Thanks,

King Wilder