First & Second Button alignment

Illdy
1

Dear colorlib team - let me first thank you very much for all your efforts on this awesome theme! I re-discoverd (after a long time) WP recently and got lucky finding this theme so quickly. I’m a novice with coding CSS, so please be gentle. I’ve managed to change the color of the buttons, but I would like the buttons to have a fixed width, with a centered title. With trail and error (and some W3 reading) I’ve experimented with text-align, etc. but to no avail. I would be very grateful if you could point me in the right direction in below code.

#header .bottom-header .header-button-one {
  width: auto;
  height: 63px;
  line-height: 57px;
  background: rgba(255, 255, 255, 0.2);
  margin: 0 15px;
  padding: 0 70px;
  display: inline-block;
  border: 3px solid #ffffff;
  border-radius: 3px;
  font-weight: 700;
  font-size: 18px;
  color: #ffffff;
  text-transform: uppercase;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
2

Hello @smoldersonline,

Can you please provide the website link, as well?

From what I can tell, you only need to change the first line to width: 300px or the static value that you want.

The text is already centered aligned, so I’m kind of missing the issue here.

Thank you

3

Thanks for your feedback.

My site resides @ www.smoldersonline.com, and this is the (current) code for Button One:

#header .bottom-header .header-button-one {
	width: 150px;
	height: 63px;
	line-height: 57px;
	background: rgba(255, 255, 255, 0.2);
	margin: 0 15px;
	padding: 0 70px;
	display: inline-block;
	border: 3px solid #FFFFFF;
	border-radius: 3px;
	font-weight: 700;
	font-size: 18px;
	color: #FFFFFF;
	text-transform: uppercase;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
4

Hello,

Modify padding: 0 70px; to padding: 0;, it should fix the issue.

5

Thank you very much, that fixed the issue just fine!