anchor element have style doesn't work in Html() from flutter_html

Question

so I want to show like button but it doesn't show that element when I run the emulator. and only show like blank space at that field. the code like this,

HTML:

<p><strong><a href="[LINK_HERE]" style="display: block; width: 80px; height: 20px; background: #FFFFF; padding: 8px; color: white;">Click Here</a></strong></p>

but when I removed the style inside, it will work like hyperlink text. the code below

<p><strong><a href="[LINK_HERE]">Click Here</a></strong></p>

I used flutter_html: ^2.2.1

Answer 1

I tried your code & found few issues in it.

1. You height is conflicting with padding. You have set height as 20px and padding as 8px. In this padding is applying within this height leaving you only 4px to view. I think its because the height is not a valid inline style supported by flutter_html. Read here. To support padding in the design I suggest try removing removing height, changing it to some bigger value or using line-height.

2. You are using background which is again not a supported inline style as per docs here. Try changing it to background-color.

Let me know if are you still facing any issue.