<!doctype html> <html><head> <title>border-image: repeat with zero-width left and right</title> <style> span { display: inline-block; margin: 5px; box-sizing: border-box; width: 13px; border-style: solid; border-color: transparent; border-width: 10px 0; border-image: url("roundrectbutton.png") 10 0 repeat; } </style> </head><body> <p> <span style="height:24px"></span> <span style="height:25px"></span> <span style="height:26px"></span> <span style="height:27px"></span> <span style="height:28px"></span> <span style="height:30px"></span> <span style="height:35px"></span> <span style="height:40px"></span> <span style="height:50px"></span> </p> </body></html>