<!DOCTYPE html>
<html>
<style>
    .none::first-letter {
        color: green;
        display: none;
    }

    .block::first-letter {
        color: green;
        display: block;
    }

    .table::first-letter {
        color: green;
        display: table;
    }

    .flex::first-letter {
        color: green;
        display: -webkit-flex;
        display: flex;
    }

    .grid::first-letter {
        color: green;
        display: grid;
        display: grid;
    }
</style>

<body>
<p>This test checks that display property is ignored in ::first-letter pseudo-element.</p>
<p>The tests passes if you see 5 lines with "Text" and the first letter green.</p>

<div class="none">
    Text
</div>

<div class="block">
    Text
</div>

<div class="table">
    Text
</div>

<div class="flex">
    Text
</div>

<div class="grid">
    Text
</div>

</body>
</html>
