Since 140a3b84cc8fea6861ca70b8451d399de2149d3d the headers have `overflow: hidden`:
``` lang=css
h1, h2, h3, h4, h5, h6 { overflow: hidden }
```
This was added because the edit section buttons were on the right margin and they floated away when there are floating elements at the right side. An other reason was the border-bottom of h1 and h2. As a normal block the border have a full width and the border bottom line is visible though transparent floating objects.
The `overflow: hidden` has some disadvantages:
* Very large letters that overflows out of the box gets cut. See T37430.
* It prohibits further development like T18691.
Edit section buttons are no floating elements anymore. This reason is gone.
Header border bottoms that are visible though transparent floating elements can still exist. Test case:
```
{| class="floatright"
|-
! Header text !! Header text !! Header text
|- | Example || Example || Example
|- | Example || Example || Example
|- | Example || Example || Example
|}
Text before the header.
== Header ==
Text after the header.
```
An alternative to `overflow: hidden` is `display: flex` (https://developer.mozilla.org/en-US/docs/Web/CSS/flex#Browser_compatibility):
``` lang=css
h1, h2, h3, h4, h5, h6 {
display: -webkit-flex;
display: flex;
}
```
But `display:flex` has impacts to other things. The edit section buttons are higher because `vertical-align: baseline` does have no result anymore. Maybe there are other possibilities.