Dev Faq
0
votes

Comment obtenir une largeur égale axée sur TD?

Salut Travailler pour créer un modèle de lettre d'information. Pour le moment je suis coincé et je ne peux pas aller au-delà de deux code> qui ont égal avec et sont centrés.

Main de vous, c'est pour un modèle de newsletter, de sorte que Web 1998, la plupart des trucs Web fantaisistes ne sont pas utiles ici! p>

J'ai joint un CODEPEN , mais ci-dessous est le code! J'ai besoin des deux logos centrés sous le texte. Des idées? p>

p> 

<table class="footertable" align="center" bgcolor="#e9eef2" width="900px">
  <tr>
    <td>
    
      <table style="height:100%;" align="center">
        <tr>
          <td>
            <p style="font-size:14px;">
            Lorem lorem lorem lorem lorem lorem lorem lorem lorem 
            </p>
          </td>
        </tr>
        <tr>
          <td>
            <img src="http://gdj.graphicdesignjunction.com/wp-content/uploads/2017/12/best-logos-2017-37.jpg" alt="logo-small.png" width="90px">
          </td>
          <td>
            <img src="https://www.prodesigns.com/backend/img/visual-brief/1497000058-alstrom.jpg" alt="noe-logo.png" width="90px">
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

2 commentaires

Votre disposition de table est invalide - vous n'avez pas de quantités égales de colonnes dans chaque ligne

Ajouter comme ça à

3 Réponses :

1
votes

Vous avez juste besoin d'un colspan fort> dans le premier TD, voir le code ci-dessous.

p> 

<table class="footertable" align="center" bgcolor="#e9eef2" width="900px">
  <tr>
    <td>
    
      <table style="height:100%;" align="center">
        <tr>
          <td colspan="2">
            <p style="font-size:14px;">
            Lorem lorem lorem lorem lorem lorem lorem lorem lorem 
            </p>
          </td>
        </tr>
        <tr>
          <td>
            <img src="http://gdj.graphicdesignjunction.com/wp-content/uploads/2017/12/best-logos-2017-37.jpg" alt="logo-small.png" width="90px">
          </td>
          <td>
            <img src="https://www.prodesigns.com/backend/img/visual-brief/1497000058-alstrom.jpg" alt="noe-logo.png" width="90px">
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

0 commentaires
0
votes

Au-delà du colspan pointé, pour centrer le contenu des cellules avec des images, vous devez ajouter ce style à ceux-ci: 

style="display:block; margin:auto;"

0 commentaires
1
votes

Vous devez d'abord laisser le TD avec le texte s'étend sur deux colonnes, puis centraliser l'image TD-S. La méthode de 1998 utilise l'étiquette centrale, mais la manière moderne utilise Text-Align: Centre. Ici, j'utilise le centre pour l'une des images et un text-alignement de l'autre. J'ai également ajouté une bordure pour rendre la table plus visible, mais la frontière doit être supprimée. 

  <table border="1" style="height:100%;" align="center">
    <tr>
      <td colspan="2">
        <p style="font-size:14px;">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation 
        </p>
      </td>
    </tr>
    <tr>
      <td style="text-align:center">
        <img src="http://gdj.graphicdesignjunction.com/wp-content/uploads/2017/12/best-logos-2017-37.jpg" alt="logo-small.png" width="90px">
      </td>
      <td>
        <center><img src="https://www.prodesigns.com/backend/img/visual-brief/1497000058-alstrom.jpg" alt="noe-logo.png" width="90px"></center>
      </td>
    </tr>
  </table>
</td>

0 commentaires

Articles qui pourrait vous intéresser :

Google Chrome Uncaught (promis) DOMException lors de la lecture AUDIO
Select2 ne s'affiche pas correctement dans le mode bootstrap
Le bootstrap de Twitter a-t-il des classes utilitaires de taille de police?
Comment puis-je définir un format pour les nombres d'entrée dans Blazor