css - how to give dynamic height in css

Question

I am trying to popluate a table dynamically using razor coding. In the table I want to give the height of the dynamically. Here is my code:

@foreach (var page in Model.Content.AncestorOrSelf(2).Children)
                {
                    var number = Model.Content.AncestorOrSelf(2).Children.Count();
                    var percent = 100/number;
                    <tr style="width: 100%; height:percent %;">
                        <td>
                            <a href="@page.Url">
                               @page.Name
                            </a>
                        </td>
                    </tr>
                }

As you can see from the above code, I am counting the number of children in the model.content and then populating the table. My requirement is that if there are 2 children, the height should be 50%, if there are 3 children, the height should be 33% and so on. I have written a razor code to calulate the percent value but i am unable to figure out how to keep the same in the height attribute. Can anyone suggest?

Answer 1

尝试这个：

 var percent = (100/number).ToString() + "%";
 @:<tr style="width: 100%; height:@percent;">

Answer 2

试试这样

String calculated = "width: 100%; height:percent '" + 10 + "';";
<tr style=@Html.Raw(calculated)>
                    <td>
                        <a href="@page.Url">
                           @page.Name
                        </a>
                    </td>
                </tr>


@Html.Raw() can be Used to render string as html.