Vertical Align <p> with inner <code> span
How do I make this <p> content have the same height with <code>

i want to make the text center so it will look like this :

i use flutter_html: ^2.2.1
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.7.0, on Microsoft Windows [Version 10.0.22621.1413], locale en-ID)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[√] Chrome - develop for the web
[√] Visual Studio - develop for Windows (Visual Studio Community 2022 17.5.0)
[√] IntelliJ IDEA Community Edition (version 2022.3)
[√] VS Code (version 1.76.1)
[√] Connected device (3 available)
[√] HTTP Host Availability
is there anything I can do to achieve it? thanks.
What sort of styles do you have applied? That would give us a hint as to where the issue is.
sorry for the late reply.., I use custom render to override the normal <code> style and create something like this:
I already changes to TagExtension (3.0.0-beta1)
TagExtension(
tagsToExtend: {"code"},
builder: (extensionContext) {
return CustomCodeRender(renderContext: extensionContext);
},
),
and here's in the build method :
return Container(
width: isMultiLine
? MediaQueryData.fromWindow(WidgetsBinding.instance.window)
.size
.width
: null,
padding: const EdgeInsets.all(2),
decoration: BoxDecoration(
color: const Color.fromARGB(255, 240, 240, 240),
border: isMultiLine ? Border.all(color: Colors.grey) : null,
borderRadius: const BorderRadius.all(Radius.circular(4))),
child: Padding(
padding: isMultiLine ? const EdgeInsets.all(8) : EdgeInsets.zero,
child: Text(
codeText,
style: TextStyle(
fontSize: isMultiLine ? 14 : 12, fontFamily: 'JetBrainsMono'),
),
));
but I don't find anyway to make it center...
Hello, Did you find any solution ?
nope, I'm currently working on something else and since it's just minor issue, i'm not using my time to troubeshoot it 😅