Ask coding questions

← Back to all posts
How to align a button
h
smoldev (6)

Heyyy! This is a question regarding html, css. I have made a button

<a href="/january"><button class="button">January</button></a>

and I have designed it with css

.button {
  background: blue;
  border: 5px solid blue;
  border-radius: 5%;
  font-size: 20px;
  font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  box-shadow: 5px 5px grey;
}

So how do i align the button?

Comments
hotnewtop
notGilbert (45)

if you want the January button to switch pages, you actually dont need the <button>

if you want to align the text to the center of the background you use CSS padding and background-color:

<a href="/january" class="button">January</a>
.button {
  background-color: #eee; 
  padding: 1rem; /* or whatever you want */
  /* insert more properties here */
}
smoldev (6)

@notGilbert hey, thanks. But i have one issue with removing <button> and that is. The button doesnt show text, it only shows when u click on it.

notGilbert (45)

@smoldev ? it works fine, have you tried adding a color property (to change the font color)

can you send a screenshot or a repl?

check this out

smoldev (6)

@notGilbert hiya, sorry i logged off, so yeah i forgot color property, anyways thanks :)