flutter_html
flutter_html copied to clipboard
Sub6Resources
[BUG] Table row width overflow
Describe the bug:
The table cell overflow constraint when width is too large.
HTML to reproduce the issue:
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<meta name=Generator content="Microsoft Word 15 (filtered)">
<style> <!-- /* Font Definitions */
@font-face {
font-family: Wingdings;
panose-1: 5 0 0 0 0 0 0 0 0 0;
}
@font-face {
font-family: "Cambria Math";
panose-1: 2 4 5 3 5 4 6 3 2 4;
}
@font-face {
font-family: Calibri;
panose-1: 2 15 5 2 2 2 4 3 2 4;
}
@font-face {
font-family: "Calibri Light";
panose-1: 2 15 3 2 2 2 4 3 2 4;
}
@font-face {
font-family: Verdana;
panose-1: 2 11 6 4 3 5 4 4 2 4;
}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal {
margin-top: 0cm;
margin-right: 0cm;
margin-bottom: 8.0pt;
margin-left: 0cm;
line-height: 105%;
font-size: 11.0pt;
font-family: "Calibri", sans-serif;
}
a:link, span.MsoHyperlink {
color: #0563C1;
text-decoration: underline;
}
p.MsoListParagraph, li.MsoListParagraph, div.MsoListParagraph {
margin-top: 0cm;
margin-right: 0cm;
margin-bottom: 8.0pt;
margin-left: 36.0pt;
line-height: 105%;
font-size: 11.0pt;
font-family: "Calibri", sans-serif;
}
p.MsoListParagraphCxSpFirst, li.MsoListParagraphCxSpFirst, div.MsoListParagraphCxSpFirst {
margin-top: 0cm;
margin-right: 0cm;
margin-bottom: 0cm;
margin-left: 36.0pt;
line-height: 105%;
font-size: 11.0pt;
font-family: "Calibri", sans-serif;
}
p.MsoListParagraphCxSpMiddle, li.MsoListParagraphCxSpMiddle, div.MsoListParagraphCxSpMiddle {
margin-top: 0cm;
margin-right: 0cm;
margin-bottom: 0cm;
margin-left: 36.0pt;
line-height: 105%;
font-size: 11.0pt;
font-family: "Calibri", sans-serif;
}
p.MsoListParagraphCxSpLast, li.MsoListParagraphCxSpLast, div.MsoListParagraphCxSpLast {
margin-top: 0cm;
margin-right: 0cm;
margin-bottom: 8.0pt;
margin-left: 36.0pt;
line-height: 105%;
font-size: 11.0pt;
font-family: "Calibri", sans-serif;
}
.MsoChpDefault {
font-size: 10.0pt;
font-family: "Calibri", sans-serif;
}
/* Page Definitions */
@page WordSection1 {
size: 595.3pt 841.9pt;
margin: 70.85pt 70.85pt 70.85pt 70.85pt;
}
div.WordSection1 {
page: WordSection1;
}
/* List Definitions */
ol {
margin-bottom: 0cm;
}
ul {
margin-bottom: 0cm;
}
--> </style>
</head>
<body lang=FR link="#0563C1" vlink="#954F72" style='word-wrap:break-word'>
<table class=MsoTableGrid border=1 cellspacing=0 cellpadding=0 style='margin-left:34.0pt;border-collapse:collapse;border:none'>
<tr>
<td width=160 valign=top style='width:120.25pt;border:solid windowtext 1.0pt; padding:0cm 5.4pt 0cm 5.4pt'><p class=MsoNormal style='margin-bottom:0cm'><a name="_Hlk89792879"><b><span style='font-family:"Calibri Light",sans-serif'>Pour l’évènement et les participants :</span></b></a></p></td>
<td width=735 valign=top style='width:551.45pt;border:solid windowtext 1.0pt; border-left:none;padding:0cm 5.4pt 0cm 5.4pt'><p class=MsoListParagraphCxSpFirst style='margin-top:0cm;margin-right:0cm; margin-bottom:0cm;margin-left:21.45pt;text-indent:-18.0pt'><span style='font-family:"Verdana",sans-serif'>-<span style='font:7.0pt "Times New Roman"'> </span></span><span style='font-family:"Calibri Light",sans-serif'>La fiche « Créer un évènement » renseignée ; Disponible : </span><a href="https://google.fr"><span style='font-family:"Calibri Light",sans-serif'>ici</span></a><span style='font-family:"Calibri Light",sans-serif'>.</span></p>
<p class=MsoListParagraphCxSpMiddle style='margin-top:0cm;margin-right:0cm; margin-bottom:0cm;margin-left:21.45pt;text-indent:-18.0pt'><span style='font-family:"Verdana",sans-serif'>-<span style='font:7.0pt "Times New Roman"'> </span></span><span style='font-family:"Calibri Light",sans-serif'>Agenda/programme de l’évènement au format PDF.</span></p>
<p class=MsoListParagraphCxSpLast style='margin-top:0cm;margin-right:0cm; margin-bottom:0cm;margin-left:21.45pt;text-indent:-18.0pt'><span style='font-family:"Verdana",sans-serif'>-<span style='font:7.0pt "Times New Roman"'> </span></span><span style='font-family:"Calibri Light",sans-serif'>Justification du dépassement des seuils pour l’hospitalité </span></p></td>
</tr>
<tr style='height:33.55pt'>
<td width=896 colspan=2 style='width:671.7pt;border:solid windowtext 1.0pt; border-top:none;padding:0cm 5.4pt 0cm 5.4pt;height:33.55pt'><p class=MsoNormal align=center style='margin-bottom:0cm;text-align:center'><b><span style='font-family:"Calibri Light",sans-serif;color:red'>Attention</span></b><span style='font-family:"Calibri Light",sans-serif;color:red'> </span><span style='font-family:"Calibri Light",sans-serif'>pour les évènements virtuels l’hospitalité est interdite</span></p></td>
</tr>
<tr>
<td width=160 valign=top style='width:120.25pt;border:solid windowtext 1.0pt; border-top:none;padding:0cm 5.4pt 0cm 5.4pt'><p class=MsoNormal style='margin-bottom:0cm'><b><span style='font-family: "Calibri Light",sans-serif'>Pour l’orateur :</span></b></p></td>
<td width=735 style='width:551.45pt;border-top:none;border-left:none; border-bottom:solid windowtext 1.0pt;border-right:solid windowtext 1.0pt; padding:0cm 5.4pt 0cm 5.4pt'><p class=MsoListParagraphCxSpFirst style='margin-top:0cm;margin-right:0cm; margin-bottom:0cm;margin-left:21.45pt;text-indent:-18.0pt'><span style='font-family:"Verdana",sans-serif'>-<span style='font:7.0pt "Times New Roman"'> </span></span><span style='font-family:"Calibri Light",sans-serif'>L’autorisation cumul d’activité si praticien Hospitalier ou Hospitalo-universitaire</span></p>
<p class=MsoListParagraphCxSpMiddle style='margin-top:0cm;margin-right:0cm; margin-bottom:0cm;margin-left:21.45pt;text-indent:-18.0pt'><span style='font-family:"Verdana",sans-serif'>-<span style='font:7.0pt "Times New Roman"'> </span></span><span lang=EN-GB style='font-family:"Calibri Light",sans-serif'>CV / bibliographie / extrait AMELI</span></p>
<p class=MsoListParagraphCxSpMiddle style='margin-top:0cm;margin-right:0cm; margin-bottom:0cm;margin-left:21.45pt;text-indent:-18.0pt'><span lang=EN-GB style='font-family:"Verdana",sans-serif'>-<span style='font:7.0pt "Times New Roman"'> </span></span><span lang=EN-GB style='font-family:"Calibri Light",sans-serif'>Le FMV calculator complété</span></p>
<p class=MsoListParagraphCxSpLast style='margin-top:0cm;margin-right:0cm; margin-bottom:0cm;margin-left:21.45pt;text-indent:-18.0pt'><span style='font-family:"Verdana",sans-serif'>-<span style='font:7.0pt "Times New Roman"'> </span></span><span style='font-family:"Calibri Light",sans-serif'>La fiche « Créer un contrat » renseignée ; Disponible : </span><a href="https://google.fr"><span style='font-family:"Calibri Light",sans-serif'>ici</span></a><span style='font-family:"Calibri Light",sans-serif'>.</span></p></td>
</tr>
</table>
</body>
</html>
Current output :
Html widget configuration:
@override
Widget build(BuildContext context) {
return Html(
data: html,
onAnchorTap: (String? url, RenderContext context, Map<String, String> attributes, dynamic element) {
if (url == null) return;
openLink(url);
},
onLinkTap: (String? url, RenderContext context, Map<String, String> attributes, dynamic element) {
if (url == null) return;
openLink(url);
},
);
}
Expected behavior:
Screenshots:
Device details and Flutter/Dart/flutter_html versions:
flutter_html: 2.2.1 Flutter version 2.5.3 Testing on Flutter web Chrome Chrome (web) • chrome • web-javascript • Google Chrome 96.0.4664.55
Stacktrace/Logcat
Additional info:
A picture of a cute animal (not mandatory but encouraged)
This pull request fix the bug : https://github.com/Sub6Resources/flutter_html/pull/938
I'm a bit confused. Your description talks about the link style for anchor tags, but example and linked PR are about the table with.
Could you review your issue?
I'm a bit confused. Your description talks about the link style for anchor tags, but example and linked PR are about the table with.
Could you review your issue?
Hi, my bad, i created two PR and two issues. It's fixed.
