Tuesday, June 13, 2017

How to change the size of a HTML button

How to change the size of a HTML button

Button Sizes

Change the font size of a button using the font-size property


Sample code: To change the width/size of HTML button


<!DOCTYPE html>
<html>
<head>
<style>
    .button
    {
        background-color: green;
        border: none;
        color: white;
        padding: 14px 28px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 14px;
        margin: 4px 2px;
        cursor: pointer;
    }

    .button1 {font-size: 10px;}
    .button2 {font-size: 15px;}
    .button3 {font-size: 20px;}
</style>
</head>
<body>
    <h2>Button Sizes</h2>
    <p>Change the font size of a button using the font-size property</p>
    <button class="button button1">10px</button>
    <button class="button button2">15px</button>
    <button class="button button3">20px</button>
</body>
</html>

How to change the size of a HTML button

How to change the size of a HTML button Button Sizes Change the font size of a button using the font-size property 10px ...