JSFiddle - React, Tailwind, and code Playground

by nndd

HTML

<body>
    <div id="header">Logo / elementy menu poziomego</div>
    <div id="container">
        <div id="menuleft">
            <!-- <?php include "menuleft.php"; ?> -->
            <p class="ml">element menu 1</p>
            <p class="ml">element menu 2</p>
            <p class="ml">element menu 3</p>
        </div>
        <div id="center">
            <!-- <?php include ... ?> -->Treść Treść Treść Treść Treść Treść Treść</br>Tylko co zrobić by ta treść była wyżej, wyrównana do góry, tuż pod logo? Tyczy się też tego bloku z prawej :P</div>
        <div id="adR">Banner pionowy 160*600px</div>
    </div>
    <div id="footer">
        <!-- <?php include "footer.php"; ?> -->Stopka / informacje o autorze / licznik wyświetleń</div>
</body>

CSS

#body {
        margin-left: auto;
    margin-right: auto;     
    
}

div {
    margin: 3px;
    padding: 3px;
}
#header {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: #AFF;
    width: 80%;
    height: 30px;
}

#container {
    margin-left: auto;
    margin-right: auto;     
}
    
#menuleft {
    display: inline-block;
    border: 1px dotted #444;
    vertical-align: top;
    min-width: 80px;
    width: 15%;
    min-height: 150px;
}
.ml {
    background-color: #9AF;
}
#center {
    display: inline-block;
    background-color: #CCF;
    width: 45%;
    min-height: 150px;
    vertical-align: top;
}
#adR {
    display: inline-block;
    background-color: #AAA;
    min-width: 60px;
    width: 15%;
    min-height: 150px;
    vertical-align: top;
}
#footer {
    margin-left: auto;
    margin-right: auto;
    background-color: #CAF;
    width: 80%;
    height: 50px;
}