JSFiddle - React, Tailwind, and code Playground

by mrnobody

HTML

<!DOCTYPE html>
<html lang="ru">
  <head>
    <link rel="stylesheet"  href="post.css" >
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="/favicon.ico">

    <title>Отправка формы на почту </title>

    <!-- Bootstrap core CSS -->
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->

  </head>

  <body>
    <div class="container">

      <div class="row">
      	<div class="col-sm-4 col-sm-offset-4">
      		<form action="mail.php" method="POST">
      			<legend>Заголовок формы</legend>

      			<div class="form-group">
      				<label for="">Введите ваше имя</label>
      				<input type="text" class="form-control" id="" name="user_name" placeholder="Например, Иван">
      			</div>

      			<div class="form-group">
      				<label for="">Введите номер телефона</label>
      				<input type="text" class="form-control" id="" name="user_phone" placeholder="+7 (999) 99 99 999">
      			</div>

      			<div class="form-group">
      				<label for="">Введите email</label>
      				<input type="text" class="form-control" id="" name="user_email" placeholder="[email protected]">
      			</div>

      			<button type="submit" class="btn btn-primary">Связаться со мной</button>
      		</form>
      	</div><!-- .col-sm-4 -->
      </div> <!-- .row -->

    </div><!-- /.container -->


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
   ...

CSS

.container{
	text-align: center;
}

body {
  display: flex;
  align-items: center;
  justify-content: center;
}

body row{
	background-color: #06031D;
}
form {
				background-color: #fff;
}