Tab character in <ol> for font weights bellow w400

[viniciusaro]

Hi, I've noticed a weird character that looks like a tab in <li> elements for ordered lists. It happens only when the content needs a line break and the font weight is w300 or less. Any clues how to solve that?

Here's a minimal example that reproduces the problem (library version 1.0.0):

import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';

import 'package:flutter_html/style.dart';

const htmlData = """
<ol>
<li>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</li>
</ol>
""";

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) => MaterialApp(home: MyHomePage());
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('flutter_html Example'),
      ),
      body: SingleChildScrollView(
        child: Html(
          data: htmlData,
          style: {
            "*" : Style(fontWeight: FontWeight.w300)
          }
        ),
      ),
    );
  }
}

The Flutter version is 1.17.3 as stated running flutter doctor
• Flutter version 1.17.3 at [...]
• Framework revision b041144f83 (12 days ago), 2020-06-04 09:26:11 -0700
• Engine revision ee76268252
• Dart version 2.8.4

This is a print of a list with FontWeight.w300

This is a print of a list with FontWeight.w400

[ryan-berger]

Strange. I'll take a look at this this weekend.

[diegoalex]

I had the same issue .
This workaround save my day 🙂

Html( data: myData.html_content, style: { "ul": Style(fontWeight: FontWeight.w400) }, );

[tneotia]

Took care of this in the above PR, it was related to the font size. Basically it now has a separate text widget just for the tab character without any text styling so the unknown character box doesn't show up.