Click here to Skip to main content
15,881,898 members
Please Sign up or sign in to vote.
4.00/5 (2 votes)
See more:
Ok, this one is driving me batty.

I have a web page with a table. The table contains various input controls that let the user select database search parameters. There are two asp:TextBox / asp:Image combos implementing two ajax:CalendarExtender controls.

The table is styled to include additional padding in the cells, to give some visual space between the controls:

table.Search td {
    padding:0.25em;
    border-top:solid 1px #000;
    border-right:solid 1px #000;
    border-bottom:solid 1px #000;
    vertical-align:middle;
}
        
table.Search th {
    padding:0.25em;
    border-top:solid 1px #000;
    border-left:solid 1px #000;
    border-bottom:solid 1px #000;
    background-color:#fff;
    font-weight:bold;
    vertical-align:middle;
}


My problem seems to come with the padding and border styles: they are being inherited by the AJAX control, with the result that the calendar cells are not completely bordered (because the td lacks a left border) and there is too much padding in the cells, so the drop-down calendar does not display half of Friday, all of Saturday, and is missing all of the bottom row.

I have tried styling the calendar directly, like so:

.ajax__calendar_body td,
.ajax__calendar_body th {
	padding:0;
	margin:0;
}

.ajax__calendar_dayname {
	margin:0;
	padding:0;
}

.ajax__calendar_day {
	margin:0;
	padding:0;
}


and I can do some things, like change background color and font weight, but I cannot get rid of the (censored) padding. Any suggestions?
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900