How to use a sandbox buyer account with PayPal payment button?

I am trying to use a PayPal button in a simple html page in my dev environment.

For this,

I created a business account on PayPal using my personal email account
Then, I generated a Subscibe button using this business account

After above steps I went to https://developer.paypal.com/developer/accounts/ where I found a test buyer and a test business account automatically created.

When I run the page whose markup is as below, it takes me to a payment page that looks like this:

Question: When I click on login button in above screen shot and try to login using the test buyer account that's there in my sandbox accounts, it never logs in? Is the sandbox account supposed to be used differently or am I missing some steps?

My Html Page Markup using PayPal button

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
</head>
<body>
    <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
        <input type="hidden" name="cmd" value="_s-xclick">
        <input type="hidden" name="hosted_button_id" value="LZPMU8S36JYEL">
        <table>
            <tr><td><input type="hidden" name="on0" value="Plan Options">Plan Options</td></tr>
            <tr>
                <td>
                    <select name="os0">
                        <option value="Basic">Basic : $100.00 USD - monthly</option>
                        <option value="Silver">Silver : $150.00 USD - monthly</option>
                        <option value="Gold">Gold : $200.00 USD - monthly</option>
                    </select>
                </td>
            </tr>
        </table>
        <input type="hidden" name="currency_code" value="USD">
        <input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_subscribeCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
        <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
    </form>
</body>
</html>

Solution

I found the answer to my problem.

The reason the test buyer account was not working was because I created the PayPal button html using a PayPal account that was valid only in live environment. When you sign up as a new user on Paypal you always end up creating an account in live environment of PayPal.
The button html was generated using this live environment account and therefore it was not working with the test buyer account.

I needed to create the button html using the test business account that was automatically created in sandbox i.e. in test environment for my live PayPal account. To do that I have to go through the 3 steps mentioned below.

go to https://developer.paypal.com/developer/accounts/ and change the account type to Business Pro by going to the Profile of test business account
then go to https://www.sandbox.paypal.com/home and login using this test business account ( don't try to login with this account on https://www.paypal.com/webapps/mpp/merchant since it will never log you in when using test accounts)
once you have logged in with the test business account, you should then create the button html.

The button html if properly generated using above 3 steps, should have the action attribute of form element point to a www.sandbox.paypal.com URL and not to a www.paypal.com URL.

The html I got after these 3 steps is as below which I found worked with test buyer account.

<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_top">
    <input type="hidden" name="cmd" value="_s-xclick">
    <input type="hidden" name="hosted_button_id" value="AW24K22D6HW9Q">
    <table>
        <tr><td><input type="hidden" name="on0" value="Plan Options">Plan Options</td></tr>
        <tr>
            <td>
                <select name="os0">
                    <option value="Basic">Basic : $100.00 USD - monthly</option>
                    <option value="Silver">Silver : $150.00 USD - monthly</option>
                    <option value="Gold">Gold : $200.00 USD - monthly</option>
                </select>
            </td>
        </tr>
    </table>
    <input type="hidden" name="currency_code" value="USD">
    <input type="image" src="https://www.sandbox.paypal.com/en_US/i/btn/btn_subscribeCC_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
    <img alt="" border="0" src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>