[whatwg] HTML <fieldset> rendering

Robert O'Callahan robert at ocallahan.org
Wed Jan 15 19:08:43 PST 2014

The rendering of fieldsets is under-specified at the moment, even taking
into account

1) No spec describes how browsers move the top border of the fieldset down
by about half the height of the "rendered legend".

2) It's unclear how 'overflow' should work on a fieldset.
2a) For "overflow:hidden", Blink seems to clip to something outside the
fieldset's border (actually I think it clips to the inside of where the
border would be if the legend hadn't forced the top edge to move down), and
clips the rendered legend. Gecko clips to the inside of the fieldset's
border and does not clip the legend.
(I think a strict reading of the spec would suggest that you should clip to
the inside of the border and the legend should be clipped like any other
descendant, but that would make overflow:hidden useless with legends, and
it would break existing content.)
2b) For "overflow:auto/scroll", the scrollport corresponds to the cliprect
for 'overflow:hidden' in both browsers. Blink scrolls all the children of
the fieldset (but not its border). (This looks very strange when the legend
scrolls away from the border.) Gecko scrolls everything except the rendered

3) It's unclear how absolutely positioned children work when a fieldset is
an abs-pos container.
Blink and Gecko agree that the abs-pos container bounds for absolutely
positioned regular children as well as abs-pos descendants of the rendered
legend match the cliprect used for overflow:hidden (though they disagree on
what that is), and that if the fieldset is scrollable then all abs-pos
descendants scroll with it.
However, Gecko's behavior here is just broken when an abs-pos child of the
rendered legend has auto left/top and you scroll the fieldset, and it's
deeply unsatisfying to have the grandchild of the fieldset be scrolled by
the fieldset while the parent in the middle is not.

Blink's behavior is simple from an implementation point of view: you
pretend the top border-edge didn't move down (well, except for background
positioning and maybe other things) and just draw the top edge in a
different place, and everything else is unchanged. Gecko's behavior is much
more like you've actually moved the top border-edge down, but that approach
requires you to exclude the rendered legend from overflow clipping and
scrolling, and gets tricky when the fieldset is an abs-pos container. OTOH
for scrolling fieldsets Blink's behavior is a bit farcical.

I'm not sure what to do.

Jtehsauts  tshaei dS,o n" Wohfy  Mdaon  yhoaus  eanuttehrotraiitny  eovni
le atrhtohu gthot sf oirng iyvoeu rs ihnesa.r"t sS?o  Whhei csha iids  teoa
stiheer :p atroa lsyazye,d  'mYaonu,r  "sGients  uapr,e  tfaokreg iyvoeunr,
'm aotr  atnod  sgaoy ,h o'mGee.t"  uTph eann dt hwea lmka'n?  gBoutt  uIp
waanndt  wyeonut  thoo mken.o w

More information about the whatwg mailing list