JSFiddle - React, Tailwind, and code Playground

by Denis Tverdokhlebov

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>сайт</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
<header>
    <div class="wrapper full background">
        <div class="center background_2 top">
            <div class="left_box">
                <p class="auto">Авторизация</p>
                <form action="register.php" method="post" name="r_form">
                      
                    <table>
                           
                        <tr>    
                            <td> Введите E-mail:</td>
                        </tr>

                        <tr>
                            <td><input class="vvod" type="text" name="r_name" required=" "/></td>
                        </tr>
                           
                        <tr> 
                            <td>Введите пароль:</td>
                        </tr>

                        <tr>
                            <td><input class="vvod" type="password" name="r_password" required=" "/></td>
                        </tr>
                           
                        <tr>
                            <td colspan="2"><input class="create" type="submit" name="r_send" value="Создать аккаунт"/></td>
                                
                            <td colspan="2"><input class="vhod" type="submit" name="r_send" value="Вход"/></td>
                               
                        </tr>

                        <tr>
                            <td class="link_td"><p class="link"><a href="#">Забыли свой пароль?</a></p></td>
                        </tr>



                          
                    </table>
                </form>
            </div>
            <div class="center_box">
                <h1>Black Panter</h1>
            </div>
            <div class="right_box">
                <div class="search">
                    <form action="" method="post" id="search-block-form">
                        <div...

CSS

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-family: sans-serif; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
    margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */

audio,
canvas,
progress,
video {
    display: inline-block; /* 1 */
    vertical-align: baseline; /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */

[hidden],
template {
    display: none;
}

/* Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
    background-color: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
    outline: 0;
}

/* Text-level semantics
   ========================================================================== */

/**
 * Address styling not present in IE 8/9/10/11, Safari, and...