在MVC3應用特定寬度的WebGrid列

我用WebGrid採取MVC應用程序內置的排序和分頁的利益和它的工作非常好只有一個問題，我無法修復，尋找這裏的任何人的幫助在MVC3應用特定寬度的WebGrid列

我的WebGrid是看起來像按以下

@{ 
     var grid = new WebGrid(Model, canSort: true, canPage: true, rowsPerPage: 10); 
     grid.Pager(WebGridPagerModes.NextPrevious); 
     @grid.GetHtml(columns: grid.Columns(

     grid.Column("Name", "Name", canSort: true), 
     grid.Column("Address", "Address", canSort: true),   
     //other columns 
     )); 
    }

我如何固定每列的寬度按我的要求嗎？（需要不同的列不同的寬度）

來源

2012-02-20 Arun Rana

你可以使用樣式：

@grid.GetHtml(columns: grid.Columns(
    grid.Column("Name", "Name", canSort: true, style: "name"), 
    grid.Column("Address", "Address", canSort: true, style: "address") 
));

，並在你的CSS文件：只有

.name { 
    width: 50px; 
} 

.address { 
    width: 300px; 
}

來源

2012-02-20 08:14:50

感謝您的幫助，但我有更多的一個主題，我已經與customthemeengine管理，是否有任何其他選項設置寬度通過將它放在grid.GetHtml（）部分？ – 2012-02-20 08:25:06

CSS

/*IE7+*/ 
th:first-child { width:30px; } 
th:first-child + th { width:30px; } 
th:first-child + th + th { width:100px; } 
/*IE9 +*/ 
th:nth-of-type(1) { width:30px; } 
th:nth-of-type(2) { width:30px; } 
th:nth-of-type(3) { width:100px; } 
th:nth-of-type(4) { width:200px; } 
th:nth-of-type(5) { width:40px; }

來源

2013-04-13 13:03:47 pippopd

它根本不工作。 – 2013-04-27 01:56:41

爲了增加Darin Dimitrov的好建議會進一步推薦一個約定（因爲CSS促進重用），嘗試對經常使用的元素（例如，列）使用現有的或常用的樣式 - 請記住，您可以應用多個樣式，在這裏以空格分隔 - 它們將被簡單地合併到結果屬性中。

@{ 
    var grid = new WebGrid(Model, canSort: true, canPage: true, rowsPerPage: 10); 
    grid.Pager(WebGridPagerModes.NextPrevious); 
    @grid.GetHtml(columns: grid.Columns(

    grid.Column("Name", "Name", canSort: true, style: "col-sm cssStyle2"), 
    grid.Column("Address", "Address", canSort: true, style: "col-med address"),   
    //other columns 
    ));

}

/*styles*/ 
.col-sm { width: 100px; min-width: 90px; } 
.col-med { width: 150px; min-width: 120px; } <--could be reused 
.address { font-weight: bold; } <-- could be reused 
.cssOther3 { font-weight: bold; } <-- may not be as not as reusable 
.cssStyle2 { text-align: right; }

因此，換句話說，你不堅持一個風格包繼續可以靈活運用「再利用」的時候。

來源

2014-07-22 14:46:05 kirkpabk

在我的情況下，添加最小寬度的幫助 – Antoops 2017-01-16 13:01:21

在MVC3應用特定寬度的WebGrid列

回答

相關問題