Hello,

I have the following code -

<div class="dropdown-menu megamenu" aria-labelledby="navbarDropdown">
                <div class="row">
                @foreach(var childItem in item.Children.OrderBy(x => x.Name)) 
                {

                    <div class="col-sm-6 col-lg-3">
                    @if(item.IsDocumentType("grid") && !letter.Equals(item.Name.Substring(0,1)))
                    {
                    <div class="heading"><b>@letter</b></div>
                    }

                    @if (@childItem.HasValue("itemURL"))
                    {
                    <a class="dropdown-item font-weight-bold" href='@childItem.Value("itemURL").ToString()'>@childItem.Value("itemTitle")</a>
                    }else 
                    { 
                    <a class="dropdown-item font-weight-bold" href="@childItem.Url">@childItem.Name</a>}
                    </div>
                }
             </div> 

When I execute this code it takes the first letter of the node and puts all the notes that match that letter i.e

A

• Alpha
• Alpha

B

• Bravo
• Bravo

However, the overall grouping isn't working how I would like when I inspect the code in Chrome it's breaking them all into separate divs. Which doesn't work when I want

• A --Alpha --Alpha

to be ONE DIV/Group for each letter group.

Any help would be appreciated.