[FIX] web: prevent email field to overflow

Readonly email fields break the layout if the value is long enough

Steps to reproduce:
1. Install CRM and Studio
2. Go to CRM and open any lead
3. Change the lead email and make it too large for the field size
4. Toggle Studio, in the View tab, uncheck 'Can Edit'
5. Close Studio
6. The email overflows its expected position

Solution:
Put the email field inside a grid layout div

opw-3248361

closes odoo/odoo#121020

X-original-commit: 855e72af9907cbfdcf1a0debd8011be9934eeb8f
Signed-off-by: Guillaume Merlin (megu) <megu@odoo.com>

addons/web/static/src/views/fields/email/email_field.xml

@@ -3,7 +3,9 @@
 
     <t t-name="web.EmailField" owl="1">
         <t t-if="props.readonly">
-            <a class="o_form_uri o_text_overflow" t-on-click.stop="" t-att-href="props.record.data[props.name] ? 'mailto:'+props.record.data[props.name] : undefined" t-esc="props.record.data[props.name] || ''"/>
+            <div class="d-grid">
+                <a class="o_form_uri o_text_overflow" t-on-click.stop="" t-att-href="props.record.data[props.name] ? 'mailto:'+props.record.data[props.name] : undefined" t-esc="props.record.data[props.name] || ''"/>
+            </div>
         </t>
         <t t-else="">
             <div class="d-inline-flex w-100">