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

Alignment Problem w/ RadDatePicker

5 Answers 348 Views

Calendar

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

Jeremy asked on 17 May 2012, 03:25 AM

Hi,

I have this weird alignment problem for my datepickers - the calendar box is really off from the box.

Attached is the code - I'm using the latest version of radcontrols that I'm aware of.

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="WebForm1.aspx.vb" Inherits="OcalaPlatformv2.WebForm1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">

<style type="text/css">

.style19

{

color: #000000;

height: 25px;

width: 138px;

}

.style13

{

width: 173px;

}

.style8

{

color: #000000;

}

.style20

{

height: 25px;

width: 138px;

}

.style16

{

width: 173px;

height: 25px;

}

.rdfd_{position:absolute}div.RadPicker table.rcSingle .rcInputCell{padding-right:0}.rcSingle .riSingle{white-space:normal}.RadInput_Default{font:12px

"segoe ui"

,arial,sans-serif}.riSingle{box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-webkit-box-sizing:border-box;-khtml-box-sizing:border-box}.riSingle{position:relative;display:inline-block;white-space:nowrap;text-align:left}.RadInput{vertical-align:middle}.riSingle .riDisplay{box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-webkit-box-sizing:border-box;-khtml-box-sizing:border-box}.riDisplay{position:absolute;padding:2px 0 3px 5px;border:0 solid transparent;border-width:1px 2px 0 1px;width:100%;height:100%;overflow:hidden;white-space:nowrap;text-align:left;cursor:default;margin-left:1px}.riSingle .riTextBox{box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-webkit-box-sizing:border-box;-khtml-box-sizing:border-box}

.style17

{

width: 404px;

}

</style>

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<telerik:RadSplitter ID="RadSplitter1" Runat="server" Width="800px"

Height="350px">

<telerik:RadPane ID="RadPane1" Runat="server" Width="430px">

<table style="width: 404px; font-size: small;">

<tr>

<td class="style19" style="text-align: right">

Customer

</td>

<td class="style13">

<telerik:RadComboBox ID="radComboBoxCustomer" runat="server"

AutoPostBack="true" CssClass="style8" Font-Size="X-Small"

Width="200px">

</telerik:RadComboBox>

</td>

</tr>

<tr>

<td class="style19" style="text-align: right">

Container Size

</td>

<td class="style13">

<telerik:RadComboBox ID="radComboBoxContainerBox" runat="server"

AutoPostBack="True" CssClass="style8" Enabled="false"

Width="200px">

</telerik:RadComboBox>

</td>

</tr>

<tr class="style8">

<td style="text-align: right" class="style20">

Destination

</td>

<td class="style13">

<asp:Label ID="lblDestination" runat="server"></asp:Label>

</td>

</tr>

<tr>

<td class="style19" style="text-align: right">

Oceanfreight Method

</td>

<td class="style13">

<telerik:RadComboBox ID="radComboBoxOcnMethodBox" runat="server"

AutoPostBack="True" CssClass="style8" Enabled="false"

Width="200px">

</telerik:RadComboBox>

</td>

</tr>

<tr class="style8">

<td style="text-align: right" class="style20">

Oceanfreight Cost

</td>

<td class="style13">

<asp:Label ID="lblOceanfreightCost" runat="server"></asp:Label>

</td>

</tr>

<tr class="style8">

<td style="text-align: right" class="style20">

Zip Code

</td>

<td class="style13">

<asp:Label ID="lblZipCode" runat="server"></asp:Label>

</td>

</tr>

<tr class="style8">

<td style="text-align: right" class="style20">

Trucking Company

</td>

<td class="style13">

<asp:Label ID="lbltrucker" runat="server" ForeColor="Black"></asp:Label>

</td>

</tr>

<tr class="style8">

<td class="style20" style="text-align: right">

Trucking Cost

</td>

<td class="style16">

<asp:Label ID="lblTruckingCost" runat="server"></asp:Label>

</td>

</tr>

<tr class="style8">

<td class="style20" style="text-align: right">

Analysis Date</td>

<td class="style16">

<telerik:RadDatePicker ID="radDateAnalysis" Runat="server">

</telerik:RadDatePicker>

</td>

</tr>

<tr class="style8">

<td class="style20" style="text-align: right">

Stage</td>

<td class="style16">

<telerik:RadComboBox ID="radComboBoxStage" runat="server" CssClass="style8"

Enabled="false" Width="200px">

</telerik:RadComboBox>

</td>

</tr>

<tr class="style8">

<td style="text-align: right" class="style20">

Analysis Name</td>

<td class="style13">

<telerik:RadTextBox ID="txtAnalysisName" runat="server" Width="200px">

</telerik:RadTextBox>

</td>

</tr>

</table>

</telerik:RadPane>

<telerik:RadPane ID="QuotePane" Runat="server" Width="430px">

<table class="style17">

<tr>

<td>

SAP Quote No</td>

<td>

<telerik:RadTextBox ID="Box_SAPQuoteNo" Runat="server">

</telerik:RadTextBox>

</td>

</tr>

<tr>

<td>

Valid For</td>

<td>

<telerik:RadNumericTextBox ID="Box_ValidFor" Runat="server"

DataType="System.Int32">

</telerik:RadNumericTextBox>

</td>

</tr>

</table>

</telerik:RadPane>

<telerik:RadPane ID="CalcPane" Runat="server" Width="430px">

<table class="style17">

<tr>

<td>

Ocala SO Number</td>

<td>

<telerik:RadTextBox ID="Box_OcalaSONumber" Runat="server">

</telerik:RadTextBox>

</td>

</tr>

<tr>

<td>

Customer Contracted Delivery Date</td>

<td>

<telerik:RadDatePicker ID="Box_CustomerDeliveryDate" Runat="server"

Height="20px">

<Calendar UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" runat="server"

ViewSelectorText="x">

</Calendar>

<DateInput DateFormat="M/d/yyyy" DisplayDateFormat="M/d/yyyy" runat="server"

EnableSingleInputRendering="True" Height="20px" LabelWidth="64px">

</DateInput>

<DatePopupButton HoverImageUrl="" ImageUrl="" />

</telerik:RadDatePicker>

</td>

</tr>

<tr>

<td>

Customer PO Date</td>

<td>

<telerik:RadDatePicker ID="Box_CustomerPODate" Runat="server" Height="20px">

<Calendar UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" runat="server"

ViewSelectorText="x">

</Calendar>

<DateInput DateFormat="M/d/yyyy" DisplayDateFormat="M/d/yyyy" runat="server"

EnableSingleInputRendering="True" Height="20px" LabelWidth="64px">

</DateInput>

<DatePopupButton HoverImageUrl="" ImageUrl="" />

</telerik:RadDatePicker>

</td>

</tr>

<tr>

<td>

Cut Item</td>

<td>

<telerik:RadComboBox ID="Box_CutItem" Runat="server">

</telerik:RadComboBox>

</td>

</tr>

<tr>

<td>

Fill Item</td>

<td>

<telerik:RadComboBox ID="Box_FillItem" Runat="server">

</telerik:RadComboBox>

</td>

</tr>

<tr>

<td>

Port of Origin</td>

<td>

<telerik:RadComboBox ID="Box_PortofOrigin" Runat="server">

</telerik:RadComboBox>

</td>

</tr>

<tr>

<td>

Factory Requested Ship Date</td>

<td>

<telerik:RadDatePicker ID="Box_FactoryRequestedDate" Runat="server"

Height="20px">

<Calendar UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" runat="server"

ViewSelectorText="x">

</Calendar>

<DateInput DateFormat="M/d/yyyy" DisplayDateFormat="M/d/yyyy" runat="server"

EnableSingleInputRendering="True" Height="20px" LabelWidth="64px">

</DateInput>

<DatePopupButton HoverImageUrl="" ImageUrl="" />

</telerik:RadDatePicker>

</td>

</tr>

<tr>

<td>

</td>

</tr>

</table>

</telerik:RadPane>

<br />

</telerik:RadSplitter>

</asp:Content>

Alignment Problem w/ RadDatePicker

5 Answers, 1 is accepted