<style>
.center::placeholder {
    text-align: center;
}
</style>
<!-- This tests that the placeholder is positioned correctly in different kinds of elements -->
<input type="search" placeholder="placeholder"><br>
<input type="text" placeholder="placeholder"><br>
<input type="search" placeholder="placeholder" style="direction: rtl"><br>
<input type="search" placeholder="placeholder" results=5><br>
<textarea placeholder="placeholder"></textarea><br>
<input type="text" placeholder="placeholder" style="padding-bottom: 15px;"><br>
<textarea placeholder="placeholder" style="padding-top: 15px;"></textarea><br>
<input type="text" placeholder="placeholder" style="font-size: 15px; border: solid 5px black; margin: 5px;"><br>

<input value="Value" style="line-height: 25px;">
<input placeholder="placeholder" style="line-height: 25px;"> <br>

<input value="Value" style="text-align: center;">
<input placeholder="placeholder" style="text-align: center;">
<input placeholder="placeholder" class="center"> <br>

<input type="text" placeholder="placeholder" style="padding-top: 15px; -webkit-transform: translateY(30px) rotateZ(30deg)"><br>