-
-
Notifications
You must be signed in to change notification settings - Fork 283
Open
Labels
bugSomething isn't workingSomething isn't working
Description
Steps to Reproduce
It's possible to center an image via style="display: block; margin: 0 auto;". This is working for RenderMode.column. But as soon as I changed the render mode to sliverList, the image is no longer centered.
HTML
<img style="display: block; margin: 0 auto;" src="https://www.monsterdealz.de/app/uploads/2025/11/IMG_0025-276x600.jpg"
alt="" width="276" height="600" />
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat necessitatibus quod ratione earum praesentium
consequuntur tempora alias nulla recusandae accusamus aliquam atque doloremque nesciunt assumenda, autem ea laborum
consectetur. Numquam!</p>`HtmlWidget` configuration (SliverList) -> Not working
import 'package:flutter/material.dart';
import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
const kHtml = '''
<img style="display: block; margin: 0 auto;" src="https://www.monsterdealz.de/app/uploads/2025/11/IMG_0025-276x600.jpg"
alt="" width="276" height="600" />
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat necessitatibus quod ratione earum praesentium
consequuntur tempora alias nulla recusandae accusamus aliquam atque doloremque nesciunt assumenda, autem ea laborum
consectetur. Numquam!</p>
''';
class CustomWidgetBuilderScreen extends StatelessWidget {
const CustomWidgetBuilderScreen({super.key});
@override
Widget build(BuildContext context) => Scaffold(
appBar: AppBar(
title: const Text('CustomWidgetBuilderScreen'),
),
body: const CustomScrollView(
slivers: [
HtmlWidget(
kHtml,
renderMode: RenderMode.sliverList,
),
],
),
);
}`HtmlWidget` configuration (Column) -> Working
import 'package:flutter/material.dart';
import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
const kHtml = '''
<img style="display: block; margin: 0 auto;" src="https://www.monsterdealz.de/app/uploads/2025/11/IMG_0025-276x600.jpg"
alt="" width="276" height="600" />
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat necessitatibus quod ratione earum praesentium
consequuntur tempora alias nulla recusandae accusamus aliquam atque doloremque nesciunt assumenda, autem ea laborum
consectetur. Numquam!</p>
''';
class CustomWidgetBuilderScreen extends StatelessWidget {
const CustomWidgetBuilderScreen({super.key});
@override
Widget build(BuildContext context) => Scaffold(
appBar: AppBar(
title: const Text('CustomWidgetBuilderScreen'),
),
body: const SingleChildScrollView(
child: Padding(
padding: EdgeInsets.all(8.0),
child: HtmlWidget(
kHtml,
),
),
),
);
}Tesing environment
[✓] Flutter (Channel stable, 3.35.7, on macOS 26.1 25B78 darwin-arm64, locale de-DE) [1.553ms]
• Flutter version 3.35.7 on channel stable at /Users/danielfelten/fvm/versions/3.35.7
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision adc9010625 (5 weeks ago), 2025-10-21 14:16:03 -0400
• Engine revision 035316565a
• Dart version 3.9.2
• DevTools version 2.48.0
• Feature flags: enable-web, enable-linux-desktop, enable-macos-desktop, no-enable-windows-desktop, enable-android, enable-ios, cli-animations, enable-lldb-debugging
[!] Android toolchain - develop for Android devices (Android SDK version 35.0.0) [4,9s]
• Android SDK at /Users/danielfelten/Library/Android/sdk
• Emulator version 36.1.9.0 (build_id 13823996) (CL:N/A)
• Platform android-36, build-tools 35.0.0
• Java binary at: /Users/danielfelten/.sdkman/candidates/java/current/bin/java
This JDK is specified in your Flutter configuration.
To change the current JDK, run: `flutter config --jdk-dir="path/to/jdk"`.
• Java version OpenJDK Runtime Environment JBR-17.0.12+1-1087.25-jcef (build 17.0.12+1-b1087.25)
! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses
[✓] Xcode - develop for iOS and macOS (Xcode 26.1.1) [3,9s]
• Xcode at /Applications/Xcode.app/Contents/Developer
• Build 17B100
• CocoaPods version 1.16.2
[✓] Chrome - develop for the web [144ms]
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2025.1) [144ms]
• Android Studio at /Users/danielfelten/Applications/Android Studio.app/Contents
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 21.0.6+-13391695-b895.109)
[✓] IntelliJ IDEA Ultimate Edition (version 2025.1.3) [142ms]
• IntelliJ at /Users/danielfelten/Applications/IntelliJ IDEA Ultimate.app
• Flutter plugin version 87.1
• Dart plugin version 251.27623.5
[✓] VS Code (version 1.105.1) [19ms]
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.120.0
[✓] VS Code (version 1.107.0-insider) [19ms]
• VS Code at /Applications/Visual Studio Code - Insiders.app/Contents
• Flutter extension version 3.123.20251030
[✓] Connected device (4 available) [7,1s]
• iPhone 16 Pro von Daniel (wireless) (mobile) • 00008140-000C71910253001C • ios • iOS 26.2 23C5044b
• iPhone 17 Pro (mobile) • C8B00EE3-5817-4C45-85E2-79288D340473 • ios • com.apple.CoreSimulator.SimRuntime.iOS-26-1 (simulator)
• macOS (desktop) • macos • darwin-arm64 • macOS 26.1 25B78 darwin-arm64
• Chrome (web) • chrome • web-javascript • Google Chrome 142.0.7444.176
[✓] Network resources [259ms]
• All expected network resources are available.
! Doctor found issues in 1 category.
Expected results
Actual results
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working