asp.net mvc3 webgrid header styles, css

Question

I had used a webgrid in a partial view in my project. I had implemented it fine with table style as:

.webgridtablestyle
{
width: 100%;
height: auto;

}

It displays fine. Now i want to define the different widths for different headers in webgrid. So i applied it as:

grid.Column("EquipmentManfacturer", header: "Warranty Provider", style:"width:30%")

But the width had not applied. I tried by giving table-layout: fixed in table style also.The table layout style had applied but the width style had not applied for header. Can any one please help me how to apply different widths for different headers in webgrid. I need to user only percentage for width of the table as the dashboard in which the webgrid was placed was resizable.

Sverker84 · Accepted Answer · 2012-01-09 10:29:04Z

2

As I understand, the style property is actually which class the column gets.

So create a class with the width you want and use that class in the style property.

I.e.

.column1
{
  width: 30%;
}

and then

grid.Column("EquipmentManfacturer", header: "Warranty Provider", style:"column1")

Edit: the width property for the whole grid needs to be set, set a class with tableStyle on the grid and have that class define a width property

edited Jan 9, 2012 at 10:29

answered Jan 9, 2012 at 10:04

Sverker84

4653 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Sverker84 Over a year ago

Perhaps other css-code or something else interfering with your grid/table. Have you tried with different widths?

Swetha Bindu Over a year ago

Yes i had tried. we have to place table-layout : fixed for table style or not?

Sverker84 Over a year ago

the table-layout: fixed does not work, at least not in Chrome, you should remove that line and see if it helps

Collectives™ on Stack Overflow

asp.net mvc3 webgrid header styles, css

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related