This is my HTML Table code, and I am not getting the expected output in the Outlook desktop app, but it gives me perfect output in the web outlook.
Expected Output I need:
Outlook Web Output is as expected:
Outlook Desktop App Output, NOT Expected:
Can someone make changes to the html code? I want the expected output into the Outlook desktop app.
If you want your desired layout to render consistently across the board, including Outlook instances, you must use tables to lay out your design and you must use a limited set of CSS which should be assigned inline. I'm not going to completely re-code your work, but consider the following HTML. Take note that I'm using tables, even nested tables, styles are applied inline. Note that the two tables that are positioned side by side are left and right aligned and have a width of 49%. That's because if you have two tables with a 50% width the second table tends to fall to beneath the first table. This happens because some instances of Outlook will apply a border and/or spacing around a table. Setting a width of 49% gives 'em a little wiggle room.
This is a simple HTML example aimed at answering your specific concern regarding the layout. There's more to address such as responsive design and adapting to light/dark mode but this should get you out of the woods.