mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2024-09-21 18:37:58 +03:00
5f9d80d8bc
Many properties can now have percentage values that get resolved in layout. The reference value (what is this a percentage *of*?) differs per property, so I've added a helper where you provide a reference value as an added parameter to the existing length_or_fallback().
42 lines
913 B
HTML
42 lines
913 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
#hcontainer {
|
|
background-color: black;
|
|
}
|
|
.hbar {
|
|
background-color: blue;
|
|
color: white;
|
|
}
|
|
.w25 { width: 25% }
|
|
.w50 { width: 50% }
|
|
.w75 { width: 75% }
|
|
.w100 { width: 100% }
|
|
|
|
|
|
#vcontainer {
|
|
background-color: black;
|
|
height: 200px;
|
|
}
|
|
.vbar {
|
|
background-color: blue;
|
|
color: white;
|
|
}
|
|
.h25 { height: 25% }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="hcontainer">
|
|
<div class="hbar w25">25%</div>
|
|
<div class="hbar w50">50%</div>
|
|
<div class="hbar w75">75%</div>
|
|
<div class="hbar w100">100%</div>
|
|
</div>
|
|
<br>
|
|
<div id="vcontainer">
|
|
<div class="vbar h25">25%</div>
|
|
</div>
|
|
</body>
|
|
</html>
|