CSS: Offset Textbox Start Point

by MythOfEchelon

HTML

<!DOCTYPE html> <!-- This is just my HTML5-valid template. Make sure you set this up correctly for your personal needs -->

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        
        <style>
            * {
                margin: 0;
                padding: 0;
            }
            
            div {
                float: left;
            }
            
            .searchBox{
                background-image: url("http://i26.tinypic.com/29lhjf9.png");
                background-repeat: no-repeat;
                height: 47px;
                line-height: 100%;
                width: 380px;
                padding-left: 75px; /* This offsets the cursor's starting point */
                box-sizing: border-box; /* This stops the padding from increasing the size of the text box */
            }
        </style>
    </head>
    
    <body>
        <input type="text" name="search" class="searchBox">
    </body>
</html>