JSFiddle - React, Tailwind, and code Playground
by Alexey Lisovy
HTML
<div id="div1">
<div id="div2">
<button>Кнопка</button>
<button>Кнопка2</button>
<button>Кнопка3</button>
</div>
<div>
<br>
<br>
<br>
<p class="text">ТУТ будет текст.</p>
</div>
</div>
CSS
body{
background: #777675 url('http://img.mota.ru/upload/wallpapers/2014/12/22/12/00/42316/133-1920x1080.jpg') top center no-repeat fixed;
}
#div1{
background: #F9FAFB;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
margin:130px auto 0;
position:relative;
cursor:auto;
width: 1024px;
height: 400px;
z-index: auto !important;
}
button {
background: #2E8CE3; /* Цвет фона */
padding: 7px 30px; /* Поля вокруг текста */
font-size: 13px; /* Размер шрифта */
height: 150px;
font-weight: bold; /* Насыщенность шрифта */
color: #FFFFFF; /* Цвет шрифта */
text-align: center; /* Надпись на кнопке по центру */
border: solid 1px #73C8F0; /* Параметры рамки кнопки */
opacity: 0.3;
}
#div2 { background:
url('http://img.mota.ru/upload/wallpapers/2014/12/22/12/00/42316/133-1920x1080.jpg') top center no-repeat fixed;
float: left;
}