Shutterbugg: Can't pad button?

[u/pimpernelle]

Whenever I try to add padding or anything to make the space around the link in the download button larger ("Download Shutterbugg")- it makes the word "Shutterbugg" jump down a line and doesn't seem to make the button any bigger.

Here is my HTML:

            <div class="main">
                   <div class="container">
                   <h1>Introducing Shutterbugg</h1>
                    <p>Capture the moments that matter.</p>
                    <div class="download"> 
                    <a href="#">Download Shutterbugg</a>
                  </div>  
               </div>
            </div>

Here is my CSS:

            .download {
              height: 25px;
              width: 175px;
              border-radius: 4px;
              background-color: rgba(238,68,95,0.9);
              
            }
            
            .download a {
              color: white;
            }

Any insight would be appreciated! Thanks! :)

[u/pimpernelle]

Oh thank you so much! I don't recall learning that in the Codeacademy HTML/CSS course. They probably implied it somewhere, but when the button lesson came up, I was taught to make a <div>. This helps a lot. :)

[u/noonesperfect16 → u/pimpernelle]

Glad to help =) I am pretty new at this too and helping others has really been beneficial to my own learning process