Ionic: Unable to stack li vertically

问题:

Following is code:

<div class="row">
    <div class="col-40">
        <ul class="">
            <li class="payment-type">Visa</li>
            <li class="payment-type">Mastercard</li>
        </ul>
    </div>
    <div class="col-60">60</div>
</div>

CSS

.payment-type {
    background-color: lightgray;
    text-align: center;
    margin-top: 5px;
    height: 50px;
}

AS you can see it only shows Visa rather both divs. The desired result is to to make a box like li with certain padding.