3
에서 웹 격자에 머리글을 정렬하는 방법 9 개의 열을 가진 및 기타 필드의 경우 text-align center
이 필요합니다.이 열을 정렬하려고하면 header
제대로 맞춰지지 않았으며, 열 정렬을 기반으로 특정 헤더 Column
을 정렬하는 방법.asp.net mvc
<div id="gridContent">
@grid.GetHtml(
tableStyle: "webgrid-table",
headerStyle: "webgrid-header",
footerStyle: "webgrid-footer",
alternatingRowStyle: "webgrid-alternating-row",
selectedRowStyle: "webgrid-selected-row",
rowStyle: "webgrid-row-style",
columns: grid.Columns(
grid.Column("Cust_Name", "Customer Name", style:"Custname"),
grid.Column("SalesDatestr", "Sales Date",style: "name"),
grid.Column("TotalAmount", "Total Amount", style:"Curency"),
grid.Column("Pay_Amount", "Paid Amount", style:" width: 64px; text-align: right; margin-right: 174px; border-right-style: solid; border-right-width: 29px; "),
grid.Column("Pay_Mode", "Paid Mode", style: "name"),
grid.Column("Bank_Name", "Bank Name", style: "name"),
grid.Column("Bank_Address", "Bank Address", style: "name"),
grid.Column("ChequeNo", "ChequeNo", style: "name"),
grid.Column("Cheque_Datestr", "Cheque Date", style: "name")
)
)
</div>
스타일 :
헤더
.webgrid-header td, th
{
background-color: #72AAD3; /*#D3D3D3; color: #6D70B5;*/
padding-bottom: 4px;
padding-top: 5px;
text-align: left;
border-bottom: 1px solid white;
border-top: 1px solid white;
margin-bottom: 2px;
padding: 0px 5px;
text-align: right;
height: 22px;
color: white;
font-weight: bold;
}
열
.Curency
{
text-align: right;
width: 80px;
border: rgba(250, 38, 38, 0);
border-right-style: solid;
border-right-width: 10px;
}