Calendar.CellSpacing Property
Definition
Important
Some information relates to prerelease product that may be substantially modified before it’s released. Microsoft makes no warranties, express or implied, with respect to the information provided here.
Gets or sets the amount of space between cells.
public:
property int CellSpacing { int get(); void set(int value); };
[System.ComponentModel.Bindable(true)]
public int CellSpacing { get; set; }
public int CellSpacing { get; set; }
[<System.ComponentModel.Bindable(true)>]
member this.CellSpacing : int with get, set
member this.CellSpacing : int with get, set
Public Property CellSpacing As Integer
Property Value
The amount of space (in pixels) between cells. The default value is 0
.
- Attributes
Exceptions
The specified cell spacing is less than -1.
Examples
The following code example demonstrates how to use the CellSpacing property to space the cells 5 pixels apart.
<%@ Page Language="C#" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Calendar Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>Calendar Example</h3>
<asp:Calendar id="calendar1" runat="server"
CellSpacing="5"
ShowGridLines="true"/>
</form>
</body>
</html>
<%@ Page Language="VB" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Calendar Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>Calendar Example</h3>
<asp:Calendar id="calendar1" runat="server"
CellSpacing="5"
ShowGridLines="true"/>
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<script runat="server" >
void Selection_Change(Object sender, EventArgs e)
{
// Set the cell padding and cell spacing for the Calendar control
// based on the values selected from the DropDownList control.
Calendar1.CellPadding = CellPaddingList.SelectedIndex;
Calendar1.CellSpacing = CellSpacingList.SelectedIndex;
}
</script>
<head runat="server">
<title> Calendar CellPadding and CellSpacing Example </title>
</head>
<body>
<form id="form1" runat="server">
<h3> Calendar CellPadding and CellSpacing Example </h3>
Select the cell padding and cell spacing values.
<br /><br />
<asp:Calendar id="Calendar1"
ShowGridLines="True"
ShowTitle="True"
runat="server"/>
<br /><br />
<table cellpadding="5">
<tr>
<td>
Cell padding:
</td>
<td>
Cell spacing:
</td>
</tr>
<tr>
<td>
<asp:DropDownList id="CellPaddingList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server">
<asp:ListItem> 0 </asp:ListItem>
<asp:ListItem> 1 </asp:ListItem>
<asp:ListItem Selected="True"> 2 </asp:ListItem>
<asp:ListItem> 3 </asp:ListItem>
<asp:ListItem> 4 </asp:ListItem>
<asp:ListItem> 5 </asp:ListItem>
</asp:DropDownList>
</td>
<td>
<asp:DropDownList id="CellSpacingList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server">
<asp:ListItem Selected="True"> 0 </asp:ListItem>
<asp:ListItem> 1 </asp:ListItem>
<asp:ListItem> 2 </asp:ListItem>
<asp:ListItem> 3 </asp:ListItem>
<asp:ListItem> 4 </asp:ListItem>
<asp:ListItem> 5 </asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
</form>
</body>
</html>
<%@ Page Language="VB" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<script runat="server" >
Sub Selection_Change(sender As Object, e As EventArgs)
' Set the cell padding and cell spacing for the Calendar control
' based on the values selected from the DropDownList control.
Calendar1.CellPadding = CellPaddingList.SelectedIndex
Calendar1.CellSpacing = CellSpacingList.SelectedIndex
End Sub
</script>
<head runat="server">
<title> Calendar CellPadding and CellSpacing Example </title>
</head>
<body>
<form id="form1" runat="server">
<h3> Calendar CellPadding and CellSpacing Example </h3>
Select the cell padding and cell spacing values.
<br /><br />
<asp:Calendar id="Calendar1"
ShowGridLines="True"
ShowTitle="True"
runat="server"/>
<br /><br />
<table cellpadding="5">
<tr>
<td>
Cell padding:
</td>
<td>
Cell spacing:
</td>
</tr>
<tr>
<td>
<asp:DropDownList id="CellPaddingList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server">
<asp:ListItem> 0 </asp:ListItem>
<asp:ListItem> 1 </asp:ListItem>
<asp:ListItem Selected="True"> 2 </asp:ListItem>
<asp:ListItem> 3 </asp:ListItem>
<asp:ListItem> 4 </asp:ListItem>
<asp:ListItem> 5 </asp:ListItem>
</asp:DropDownList>
</td>
<td>
<asp:DropDownList id="CellSpacingList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server">
<asp:ListItem Selected="True"> 0 </asp:ListItem>
<asp:ListItem> 1 </asp:ListItem>
<asp:ListItem> 2 </asp:ListItem>
<asp:ListItem> 3 </asp:ListItem>
<asp:ListItem> 4 </asp:ListItem>
<asp:ListItem> 5 </asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
</form>
</body>
</html>
Remarks
Use this property to control the spacing between individual cells in the calendar. This spacing is applied both vertically and horizontally.
Note
Setting this property to -1
indicates that this property is not set in the rendered table.