HTML: les dispositions des Paragraphes après le tableau figurant à droite de la table
Nous travaillons à la conception d'une application qui vous permettra d'envoyer des e-mail aux gestionnaires pour leur rappeler qu'ils ont à faire certaines autorisations. L'adresse e-mail est dans le formulaire HTML, et contient un tableau. Nous ne comprenons pas ce que nous faisons de mal pour avoir le dernier paragraphe s'affiche à droite de la table, au lieu de sous elle.
Un échantillon ci-dessous. L'outil "ordonné", sur lequel je m'appuie pour ce genre de choses, n'a pas de conseils de ce temps.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content=
"HTML Tidy for Linux/x86 (vers 6 November 2007), see www.w3.org"
name="generator">
<meta content='text/html; charset=us-ascii' http-equiv=
"Content-Type">
<style type="text/css">
body {font-family: Calibri; }
caption {font-family: Calibri;color: 'black'; font-size: '125%; }
table.main tr { };
table.main td.bottomcaption {text-align: 'center'; vertical-align: 'middle'; font-family: 'Calibri'; color: 'black'; font-color: 'black'; font-size: '125%'; }
table.main th {vertical-align: 'bottom'; color: blue; background-color: lightyellow; }
</style>
<title>Payable Time awaiting approval</title>
</head>
<body>
<p>Hello, <strong>Daffy Duck</strong>:</p>
<p>According to our records, the following Payable Time is awaiting
approval. Items shown below must be approved in order for
compensation to take place.<br></p>
<p>For questions, please contact <a href=
"MAILTO:SUPPORT@OUR_ORG.COM">Support</a></p>
<table align="left" border="1" class='main' summary="Pending details">
<caption ><strong>Awaiting approval by your reporting
structure</strong></caption>
<tr>
<th align="left"> <br>
Name</th>
<th align="center"> <br>
ID</th>
<th align="center">Work<br>
Date</th>
<th align="center"> <br>
Type</th>
<th align="center"> <br>
Hours</th>
</tr>
<tr>
<td colspan="5">Reporting to Mickey M Mouse (MMM)</td>
</tr>
<tr>
<td align="left">Daisy</td>
<td align="left">D_DUCK</td>
<td align="center">04/29/2013</td>
<td align="left">REG</td>
<td align="right">8.00</td>
</tr>
<tr>
<td align="left">Daisy</td>
<td align="left">D_DUCK</td>
<td align="center">05/01/2013</td>
<td align="left">REG</td>
<td align="right">8.00</td>
</tr>
<tr>
<td align="left">Daisy</td>
<td align="left">D_DUCK</td>
<td align="center">05/02/2013</td>
<td align="left">OT</td>
<td align="right">7.50</td>
</tr>
</table>
<p> <br></p>
<p> </p>
<p>This message comes from The Support Team</p>
</body>
</html>
Nous aimerions beaucoup pour le texte "Ce message vient de..." apparaît en dessous de la table, mais au lieu de cela, il apparaît à la droite de la table, en concordance avec le tableau du haut. Cela est vrai pour IE7, IE8 et Firefox 12.
J'apprécierais des suggestions pour aider à cette situation.
Ce qui concerne,
Dennis
- retirez le align="left" à la table
- Yep, @Francis est correct. Aussi votre CSS manque un guillemet après la
125%
dans lecaption
la règle et il y a un point-virgule aprèstable.main tr
qui doit être retiré.
Vous devez vous connecter pour publier un commentaire.
vous pourriez utiliser la même balise à ceci: http://jsfiddle.net/7fAy9/2/
ou,
vous pourriez faire quelque chose comme ceci: http://jsfiddle.net/NNrnc/
mais attention le
caption
aligner est obsolète en HTML5,la façon correcte de le faire en HTML5, ce serait:
Il suffit de retirer le
align="left"
à votre table.voir le lien: http://jsfiddle.net/rhyDe/
Testé sur IE10, FF24, Chrome 30
De solution facile. Ajouter à la dernière phrase: