Визуализация сложного div в Outlook 365

Question

Я работаю над надстройкой Outlook для проекта. Net Framework. Я хотел бы, чтобы в теле письма отображались следующие элементы:

Этот div генерируется кодом:

                        <div ng-repeat="dateGroup in timeLine.DateGroups">
                            <div class="circle color{{dateGroup.ColorId}}Solid whiteBorder" ng-style="{'left': dateGroup.Offset + 'px', 'top': (timeLine.CenterLineTop + 1) + 'px', 'width': timeLine.DotWidth + 'px', 'height': timeLine.DotWidth + 'px'}"></div>
                            <div class="labelLine colorLine{{dateGroup.ColorId}}" ng-style="{'left': dateGroup.LineOffset + 'px', 'top': dateGroup.LineTop + 'px', 'width':':1px','height' : dateGroup.Height + 'px'}"></div>
                            <div ng-if="dateGroup.TextDirection == 0" class="entryLabel" ng-style="{'left': dateGroup.LabelOffSet + 'px', 'top' : dateGroup.LabelTop + 'px', 'width' : '450px !important'}">
                                <div ng-repeat="entry in dateGroup.Entries" style="position:relative;">
                                    {{entry.EventDate | date:'MMM d'}} : {{entry.EventName}}
                                </div>
                            </div>
                            <div ng-if="dateGroup.TextDirection == 1" class="entryLabel" ng-style="{'text-align':'right', 'left': dateGroup.LabelOffSet + 'px', 'top': dateGroup.LabelTop + 'px', 'width':'450px !important'}">
                                <div ng-repeat="entry in dateGroup.Entries" style="position:relative;">
                                    {{entry.EventDate | date:'MMM d'}} : {{entry.EventName}} <br />
                                </div>
                            </div>
                        </div>
                        <div ng-repeat="monthlabel in timeLine.TimeLineMonthLabels">
                            <div ng-if="monthlabel.MonthId == 12" class="monthLabel" ng-style="{'border':'none', 'left' : monthlabel.Offset + 'px' ,'top' : timeLine.MonthLabelTop + 'px' , 'width' : timeLine.MonthSectionWidth  + 'px'}">{{monthlabel.MonthLabel}}</div>
                            <div ng-if="monthlabel.MonthId != 12" class="monthLabel" ng-style="{'left' : monthlabel.Offset + 'px' ,'top' : timeLine.MonthLabelTop + 'px' , 'width' : timeLine.MonthSectionWidth  + 'px'}">{{monthlabel.MonthLabel}}</div>
                        </div>

                        <div ng-if="timeLine.TodayLineOffset > 0" class="todayLine" ng-style="{'height': timeLine.TodayLineHeight + 'px', 'top': timeLine.TodayLineTop + 'px', 'left': timeLine.TodayLineOffset + 'px'}"></div>
                        <div ng-if="timeLine.TodayLineOffset > 0" class="todayLabel" ng-style="{'width': timeLine.TodayLabelWidth + 'px', 'top': timeLine.TodayLabelTop + 'px', 'left': timeLine.TodayLabelOffset + 'px'}">Today</div>

Проблема, с которой я столкнулся, заключается в том, что существуют свойства HTML и css, которые не поддерживаются в Outlook 365, что затрудняет повторную визуализацию этого div в перспективе. Сайт к изображению - это то, что я тоже рассматриваю, но пока не нашел эффективного способа сделать это. Мы высоко ценим ваше понимание того, как я могу представить это в перспективе.