CSS3 calc() test (v3)

Revision 3 of this benchmark created on


Description

test

Preparation HTML

<style>
.complexBlock {
                        width: -webkit-calc(100% - 50% / 3);
                        width: -o-calc(100% - 50% / 3);
                        width: calc(100% - 50% / 3);

                        padding: 5px -webkit-calc(3% - 2px);
                        padding: 5px -o-calc(3% - 2px);
                        padding: 5px calc(3% - 2px);

                        margin-left: -webkit-calc(10% + 10px);
                        margin-left: o-calc(10% + 10px);
                        margin-left: calc(10% + 10px);
                }
.simpleBlock {
width: 100px;
padding: 5px;
margin-left:10px;
}
</style>
<div id="block">
Test
</div>

<div id="block2">
Test
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
simple
document.getElementById("block2").className = "simpleBlock";
ready
complex
document.getElementById("block").className = "complexBlock";
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.