[Solved] 960 grid inside Content Display error

[Libert]

Hi, i am trying to  create a render divs inside a TabStrip on Razor view and for some reason when i change from an ul to div inside the content is display outside of the content arrea. HEre is the code any suggestion on whay is doing this

 

 http://i41.tinypic.com/kc0f9.png

 

 

<div class="grid_9 ">
        @(Html.Telerik().TabStrip()
                .Name("TabStrip").Items(tabstrip =>
                                            {
                                                tabstrip.Add()
                                                    .Text("Theme Parks")
                                                    .ImageUrl(string.Format("{0}{1}", Config.BaseURL, "/images/IconSet/ticket/multipletickets_Orange.png"))
                                                    .Content(@<text >

                                                                <div class="grid_2"> Name</div>
                                                                <div class="grid_1"> Price</div>
                                                                 <div class="grid_2"> Limit</div>
                                                                 <div class="grid_1"> Gate</div>

                                                              </text> );
                                            tabstrip.Add()
                                                .Text("Movies")
                                                .ImageUrl(string.Format("{0}{1}", Config.BaseURL, "/images/IconSet/ticket/multipletickets_Orange.png"))
                                                .Content(@<text>

                                                              <ul>
                                                                  <li>Pure ASP.NET MVC components</li>
                                                                  <li>Completely Open Source</li>
                                                                  <li>Exceptional Performance</li>
                                                                  <li>Based on jQuery</li>
                                                                  <li>Search Engine Optimized</li>
                                                                  <li>Cross-browser support</li>
                                                              </ul>
                                                          </text>);
                                        }).SelectedIndex(0))
    </div>

 

 

 

 

[Daniel]

Hi,

What are the styles of the "grid_1"  and "grid_2" classes? Such layout is expected if the elements are floated. If that is the case, you can add a div element that clears the float to avoid the problem e.g.

<div class="grid_2"> Name</div>
<div class="grid_1"> Price</div>
<div class="grid_2"> Limit</div>
<div class="grid_1"> Gate</div>
<div style="clear:both;"></div>

Regards,
Daniel
the Telerik team

[Libert]

thank you I got it :)