mirror of
https://github.com/RGBCube/serenity
synced 2025-05-24 00:05:07 +00:00

Using flex layout inside button solves the issue with wrongly calculated height when it has: pseudo element and whitespaces inside. Also using flex instead of a table layout allows for the same vertical alignment but with fewer layout nodes: a flex container and anonymous wrapper for content instead of a table wrapper, table, row, and cell.
16 lines
338 B
HTML
16 lines
338 B
HTML
<!doctype html><style>
|
|
button {
|
|
position: relative;
|
|
padding: 20px;
|
|
background: initial;
|
|
}
|
|
button:after {
|
|
content: "";
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
background: green;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
</style><body><button></button>
|