Как выровнять кнопки?

Общее
1 
Кнопки находятся друг под другом, как сделать так, что-бы они были на одном уровне в центре?!
Код кнопок
HTML
<div class="button-subscribe">
<label for="subscribe">Подписаться</label>
<input type="checkbox" id="subscribe" class="subscribe" name="subscribe">
</div>
<hr>
<br>
<div class="submit">
<button type="submit" class="submit" value="Зарегестрироваться">
<!--<img src="img/20180706221449.png" alt=Регистрация>-->
</button>
</div>
<div class="reset">
<button type="reset" class="reset" value="Сбросить">
<!--<img src="img/20180706221449.png" alt="Сбросить">-->
</button>
</div>
2 
Весь код
<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <meta name="discription" content="описание">
   <meta name="keywords" content="ключевые слова">
  <title>site</title>
  <link rel="stylesheet" href="style.css" />
</head>
<body>
  <h1>Вход/Регистрация</h1>
<hr>
<form action="htsh.ru" method=post>
<p>Ваш пол:</p>
  <label for="id_gender_male"><input type="radio" name="gender" value="male" id="id_gender_male" autofocus>Мужской</label>
  <label for="id_gender_female"><input type="radio" name="gender" value="female" id="id_gender_female" checked="checked">Женский</label>
<br>
<hr>
<div>
<p>Введите дату своего рождения:</p>
<input type="date" class="date" name="date" required>
</div>
<hr>
<br>
<p><label for="age">Ваш возраст:</label></p>
<input type="number" id="age" name="age" min="5" max="200" step=1 autocomplete="on" placeholder="гг" tabindex="4" required>
<hr>
<br>
<p><label for="phone">Введите ваш телефон:</label></p>
<input type="tel" name="phone" id="phone" placeholder="Формат: 7хххххххххх" pattern="7[0-9]{10}" autocomplete="on" tabindex="5" maxlength="11" required>
<br>
<input class="hide" id="hd-1" type="checkbox" >
<label for="hd-1">текст!</label>
Текст!
</div>
<hr>
<br>
<br>
<p><label for="mail">Введите ваш email:</label></p>
<br>
<input type="email" name="email" id="mail" pattern="([A-z0-9_.-]{1,})@([A-z0-9_.-]{1,}).([A-z]{2,8})" placeholder="youradress@mail.com" autocomplete="on" required>
<br>
<br>
<p><label for="login">Логин:</label></p>
<br>
<input type="text" name="login" id="login" maxlength="12" placeholder="Уникальное имя" required>
<br>
<br>
<p><label for="password">Пароль:</label></p>
<br>
<input type="password" name="password" id="password"  placeholder="Пароль для последующего входа" required>
<hr>
<br>
<p><label for="adress"><span>Введите адрес доставки:</span></label></p>
<br>
<input type="text" id="id_adress1" name=country placeholder=Россия disabled required>
<input type="text" id="adress" list="town" name="town" placeholder="город" tabindex="11" required>
<datalist id="town">
<option value="Москва">
<option value="Санкт-Петербург">
<option value="Новгород">
<option value="Новосибирск">
<option value="Екатеринбург">
<option value="Казань">
</datalist>
<input type="text" id="id_adress2" name="street" placeholder="улица" tabindex="12" required>
<input type="text" id="id_adress3" name="house" placeholder="дом" tabindex="13" required>
<input type="text" id="id_adress4" name="flat" placeholder="квартира" tabindex="14" required>
<input type="text" id="id_adress5" name="entrance" placeholder="подъезд" tabindex="15" required>
<input type="text" id="id_adress6" name="index" placeholder="индекс" required>
<hr>
<br>
<textarea cols="45" rows="5" name="comments" wrap="hard">Введите ваши коментарии</textarea>
<br>
<textarea cols="45" rows="5" name="wishes" wrap="hard">Введите ваши пожелания</textarea>
<br>
<p id="photo">Фото (логотип)</p>  
<input type="file" name="photo" accept="image/*">
<hr>
<div class="button-subscribe">
<label for="subscribe">Подписаться</label>
<input type="checkbox" id="subscribe" class="subscribe" name="subscribe">
</div>
<hr>
<br>
<div class="submit">
<button type="submit" class="submit" value="Зарегестрироваться">
<!--<img src="img/20180706221449.png" alt=Регистрация>-->
</button>
</div>
<div class="reset">
<button type="reset" class="reset" value="Сбросить">
<!--<img src="img/20180706221449.png" alt="Сбросить">-->
</button>
</div>
<br>
</form>
</body>
</html>

CSS
body { 
background: url(img/20180626222607.png);
} 

hr {
padding: 0;
border: none;
border-top: medium double #333;
background-color: #29b0d3;
text-align: center;
}

h1 {
font-size: 38px;
color: black;
}

p {
font-size: 20px;
}

span {
font-size: 22px;
}

em {
color: black;
font-size: 18px;
}

textarea:hover {
background-color: #e8f8fa;
}

label[for="subscribe"] {
font-size: 22px;
}

.adress {
height: 20px;
width: 150px;
margin: 15px;
}

.reset {
float: left;
}

.submit {
float: center;
}


/*
button {
text-align: center;
}

button[type=submit] {
text-align: left;
margin-left: 100px;
width: 200px;
height: 50px;
}

button[type=reset] {
margin-top: 0px;
text-align: center;
margin-left: 300px;
width: 200px;
height: 50px;
}
*/

.date {
font-size: 14px;
}

#login {
margin-bottom: 0px;
margin-left: 0px;
}

input[type="text"] {
margin-bottom: 30px;
margin-left: 20px;
}

input {
font-size: 16px;
}

input:hover {
background-color: #ffdec7;
}

input[type="file"]:hover {
background-color: #897cff;
}

input[type="date"] {
background-color: blue;
}

input[type="radio"]:hover {
background-color: blue;
}

/* скрываем чекбоксы и блоки с содержанием */
.hide,
.hide + label + div {
    display: none;
}
/* вид текста label */
.hide + label {
font-size: 20px;
    margin: 0;
    padding: 0;
    color: green;
    cursor: pointer;
    display: inline-block;
}
/* вид текста label при активном переключателе */
.hide:checked + label {
    color: red;
    border-bottom: 0;
}
/* когда чекбокс активен показываем блоки с содержанием  */
.hide:checked + label + div {
    display: block; 
    background: #efefef;
    -moz-box-shadow: inset 3px 3px 10px #7d8e8f;
    -webkit-box-shadow: inset 3px 3px 10px #7d8e8f;
    box-shadow: inset 3px 3px 10px #7d8e8f;
    margin-left: 20px;
    padding: 10px;
    /* чуточку анимации при появлении */
     -webkit-animation:fade ease-in 0.5s; 
     -moz-animation:fade ease-in 0.5s;
     animation:fade ease-in 0.5s; 
}
/* анимация при появлении скрытых блоков */
@-moz-keyframes fade {
    from { opacity: 0; }
to { opacity: 1 }
}
@-webkit-keyframes fade {
    from { opacity: 0; }
to { opacity: 1 }
}
@keyframes fade {
    from { opacity: 0; }
to { opacity: 1 }   
}
.hide + label:before {
    background-color: #1e90ff;
    color: #fff;
    content: "\002B";
    display: block;
    float: left;
    font-size: 14px; 
    font-weight: bold;
    height: 16px;
    line-height: 16px;
    margin: 3px 5px;
    text-align: center;
    width: 16px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.hide:checked + label:before {
    content: "\2212";
}
3

Нет такого значения у свойства и не было никогда.

Пройдите курс “Сетки” на сайте Академии. Тогда вопросов о размещении элементов в одну строку не возникнет.

4

Может всё-таки попробуете начать проходить курсы?
Потому, что Ваши ошибки вызывают лёгкое недоумение…

Кнопки по центру 
<!DOCTYPE html>
<html lang="ru">
<head>
	<meta charset="UTF-8">
	<title>Кнопки по центру</title>
	<style>
	.for-button {
		margin: 0 auto;
		text-align: center;
	}
  </style>
</head>
<body>
	<div class="for-button">
		<button type="submit" class="submit" value="Зарегестрироваться">Регистрация
			<!--- <img src="img/20180706221449.png" alt=Регистрация> -->
		</button>
		<button type="reset" class="reset" value="Сбросить">Сбросить
			<!--<img src="img/20180706221449.png" alt="Сбросить">-->
		</button>
	</div>
</body>
</html>
1 лайк
5

Я прохожу, но до курса «сетки» не дошел, а код я исправил верез div

7 
Css
.wrap{
  display: flex;
  justify-content: center;
}

.submit, .reset{
display: inline-block;
margin: 0 10px;
margin-top: 20px;
width: 200px;
height: 40px;
}

HTML
<div class="wrap">
<br>
<div class="submit">
<button type="submit" class="submit" value="Зарегестрироваться">
<img src="img/20180706221449.png" alt=Регистрация>
</button>
</div>
<div class="reset">
<button type="reset" class="reset" value="Сбросить">
<img src="img/20180706221449.png" alt="Сбросить">
</button>
</div>
</div>
1 лайк