JSFiddle - React, Tailwind, and code Playground

by pukster

HTML

<!DOCTYPE html>
<!-- Template by freewebsitetemplates.com -->

<!--README -->
<!--Try changing the div.make below. If you remove the  -->
<!--float:left, the orange box does not float to the left  -->
<!--but rather below it. I do not see why div.make, which  -->
<!--is nested inside div.leftPanel, should affect  -->
<!--div.rightPanel, which is NOT nested in div.leftPanel -->
<!--and therefore should not be affected by setting-->
<!--float:left in div.make -->

<html>
<head>
    <meta charset="UTF-8" />
    <title>School Calendar - Aviation School</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <!--[if IE 6]>
        <link rel="stylesheet" type="text/css" href="ie6.css" />
    <![endif]-->

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

        <style type="text/css"> 
            html, body, .100PercentHeight{
                height:100%;
            }

            div.leftPanel div.rightPanel
            {
            margin:0px;
            padding:5px;
            height:100%;
            min-height:100%;
            border:solid 1px #0f0000;
            }

            div.leftPanel
            {
            background:brown;
            width:10%;
            }

            div.rightPanel
            {
            background:orange;
            width:50%;
            height:100%;
            }

            div.rightPanel:hover
            {
            background:#cc00ff;
            }

            div.leftPanel:hover
            {
            background:#cc00ff;
            }

            div.make
            {
            margin:0px;
            padding:5px;
            text-align:center;
            background:#e5eecc;
            border:solid 1px #000000;
            width:100%;
            height:20px;
            float:left;
            }

            div.make:hover
            {
            background:#cc00ff;
            }
        </style>

</head>
<body>
    <div...

JavaScript

ggmkG