JSFiddle - React, Tailwind, and code Playground

by sundaramkumar

HTML

<!--
show divs in one line and
show a div inside one div 
setting margin-top or padding-top will affect the other div also.

now settng the
position:relative and top:aapx for the inner div will fix this problem
-->
<div class="background">
    <div class="logo">ss
    </div> 
    <div class="logo">
      <div class="panel">
        panel
      </div>
      
    </div> 
</div>

CSS

.logo
{
    background-image: url(image/logo2.png);
    height:40px;
    width:200px;
    /* margin-left:100px; */
    border:1px red solid;
    display:block;
    /* position:absolute; */
    margin-top:20px;
    display: inline-block;
}
.panel{
  margin-left:15px;
  top:10px;
  border:1px blue solid;
  width:150px;
  position:relative;
}

.background
{
    background-image: url(image/empback.png);
    width:100%;
    height:94px;
    min-width:500px;
    /*position: relative */
    border: 1px green solid;
    padding-left:10px;
}