RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 08:07:44 +00:00
Code Issues Activity Actions

LibWeb: Add special handling for text-align when applied to tables

Browse source 
This matches what other engines do, and stops table content from being
misaligned.
This commit is contained in:
implicitfield 2023-11-19 13:51:37 +04:00 • committed by Andreas Kling
parent a54e62bea0
commit ccea69ad40
3 changed files with 43 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

26
Tests/LibWeb/Layout/expected/table/internal-alignment.txt Normal file
View file

@ -0,0 +1,26 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x220 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x204 children: not-inline
BlockContainer <div> at (8,8) content-size 784x204 children: not-inline
TableWrapper <(anonymous)> at (300,8) content-size 200x204 [BFC] children: not-inline
Box <table> at (301,9) content-size 198x202 table-box [TFC] children: not-inline
Box <tbody> at (301,9) content-size 194x198 table-row-group children: not-inline
Box <tr> at (303,11) content-size 194x198 table-row children: not-inline
BlockContainer <td> at (304,85.265625) content-size 192x49.46875 table-cell [BFC] children: not-inline
BlockContainer <p> at (304,101.265625) content-size 192x17.46875 children: inline
line 0 width: 26.25, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 4, rect: [304,101.265625 26.25x17.46875]
"left"
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x220]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x204]
PaintableWithLines (BlockContainer<DIV>) [8,8 784x204]
PaintableWithLines (TableWrapper(anonymous)) [300,8 200x204]
PaintableBox (Box<TABLE>) [300,8 200x204]
PaintableBox (Box<TBODY>) [301,9 194x198] overflow: [301,9 196x200]
PaintableBox (Box<TR>) [303,11 194x198]
PaintableWithLines (BlockContainer<TD>) [303,11 194x198]
PaintableWithLines (BlockContainer<P>) [304,101.265625 192x17.46875]
TextPaintable (TextNode<#text>)

7
Tests/LibWeb/Layout/input/table/internal-alignment.html Normal file
View file

@ -0,0 +1,7 @@
<!doctype html><style>
table {
height: 200px;
width: 200px;
border: 1px solid black;
}
</style><div align="center"><table><tbody><tr><td><p>left

10
Userland/Libraries/LibWeb/DOM/Element.cpp
View file

@ -17,6 +17,7 @@
#include <LibWeb/CSS/ResolvedCSSStyleDeclaration.h>
#include <LibWeb/CSS/SelectorEngine.h>
#include <LibWeb/CSS/StyleComputer.h>
#include <LibWeb/CSS/StyleValues/IdentifierStyleValue.h>
#include <LibWeb/CSS/StyleValues/NumberStyleValue.h>
#include <LibWeb/DOM/Attr.h>
#include <LibWeb/DOM/DOMTokenList.h>
@ -45,6 +46,7 @@
#include <LibWeb/HTML/HTMLOptionElement.h>
#include <LibWeb/HTML/HTMLSelectElement.h>
#include <LibWeb/HTML/HTMLStyleElement.h>
#include <LibWeb/HTML/HTMLTableElement.h>
#include <LibWeb/HTML/HTMLTextAreaElement.h>
#include <LibWeb/HTML/Numbers.h>
#include <LibWeb/HTML/Parser/HTMLParser.h>
@ -552,6 +554,14 @@ Element::RequiredInvalidationAfterStyleChange Element::recompute_style()
// FIXME propagate errors
auto new_computed_css_values = MUST(document().style_computer().compute_style(*this));
// Tables must not inherit -libweb-* values for text-align.
// FIXME: Find the spec for this.
if (is<HTML::HTMLTableElement>(*this)) {
auto text_align = new_computed_css_values->text_align();
if (text_align.has_value() && (text_align.value() == CSS::TextAlign::LibwebLeft || text_align.value() == CSS::TextAlign::LibwebCenter || text_align.value() == CSS::TextAlign::LibwebRight))
new_computed_css_values->set_property(CSS::PropertyID::TextAlign, CSS::IdentifierStyleValue::create(CSS::ValueID::Start));
}
RequiredInvalidationAfterStyleChange invalidation;
if (m_computed_css_values)
invalidation = compute_required_invalidation(*m_computed_css_values, *new_computed_css_values);