I inherited this code for use in an email and would appreciate advice on how to fix. The code is a table that creates a topnav/menu with a logo followed by 1-3 "menu" links to take the user to a website.
CURRENT: A single table row with each element set apart by non-breaking spaces.
ISSUE: It is left aligned so the menu items float in the various responsive versions.
ASK: I think if the row is set as 4-5 columns it would allow the left cell to be "logo", an empty cell, and 3 cells for each of the nav items. It uses some additional code I think is targeting a fix needed for Outlook but I am unfamiliar with it and not sure if the proposed solution will break it.
<table width="100%" role="presentation" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="pc-sm-p-25-20 pc-xs-p-15-10" valign="middle" style="padding: 29px 30px; background-color: #ffffff; font-size: 0" bgcolor="#ffffff"><!--[if (gte mso 9)|(IE)]><table border="0" cellspacing="0" cellpadding="0" role="presentation"><tr><td valign="middle"><![endif]-->
<div style="display: inline-block; vertical-align: middle;">
<table role="presentation" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td valign="top" style="padding: 10px;"><a style="text-decoration: none;" href="http://https://www.website.com"><img width="130" height="" style="max-width: 100%; height: auto; border: 0; line-height: 100%; outline: 0; -ms-interpolation-mode: bicubic; font-size: 14px; color: #1B1B1B;" alt="" src="images/fpo-logo-1180x239.jpg"></a></td>
</tr>
</tbody>
</table>
</div>
<!--[if (gte mso 9)|(IE)]></td><td valign="middle"><![endif]-->
<div style="display: inline-block; vertical-align: middle;">
<table role="presentation" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td valign="top" style="padding: 10px; line-height: 18px; font-family: Helvetica, sans-serif; font-size: 14px;"><a style="text-decoration: none; font-family: 'Fira Sans', Helvetica, Arial, sans-serif; font-size: 12px; font-weight: 500; color: #454545" href="https://www.website.com/path1">Path 1</a> <span style="font-family: Helvetica, sans-serif; font-size: 20px;"> </span> <a style="text-decoration: none; font-family: 'Fira Sans', Helvetica, Arial, sans-serif; font-size: 12px; font-weight: 500; color: #454545" href="https://www.website.com/ath2">Path 2</a> <span style="font-family: Helvetica, sans-serif; font-size: 20px;"> </span> <a style="text-decoration: none; font-family: 'Fira Sans', Helvetica, Arial, sans-serif; font-size: 12px; font-weight: 500; color: #454545" href="https://www.website.com/path3">Path 3</a></td>
</tr>
</tbody>
</table>
</div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]--></td>
</tr>
</tbody>
</table>