JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div class="vizitka"> <!-- pozicija vizitk -->
<div class="infotocka">
<h1>Infotočka</h1>
<p>gregerag</p>
<a href="#">več...</a>
</div>
<div class="svetovanje">
<h1>Svetovanje</h1>
<p>
gukgzig
</p>
<a href="#">več...</a>
</div>
<div class="ocenjevanje">
<h1>Ocenjevanje</h1>
<p>
fukzuk
</p>
<a href="#">več...</a>
</div>
<div class="onas">
<h1>O nas</h1>
<p class="text">
rtjhrjrtzjrtjrtj
</p>
<a href="#">več...</a>
</div>
<div class="glavna">
<p>
zktuik
</p>
<p>
<br>Kzukzukruzk</br>
<br>zurkzutkzrk</br>
<br>zuktzuktuzk</br>
</p>
<p>
<br>Trzukzrukrk</br>
<br>rzukruzkrzuk</br>
<br>rzukrzukrzuki</br>
</p>
</div>
</div>
</body>
<footer>
<p>ghiuhtohjotr</p>
</footer>
CSS
.vizitka{
position:relative;
/*/left:50%;*/
top:50%;
margin: 232px 0 0 438px;
}
.glavna{
width:346px;
height:192px;
background: white;
position: absolute;
box-shadow: 5px 5px 13px #181818;
transform: rotate(0deg);
-ms-transform: rotate(0deg); /* IE 9 */
-webkit-transform: rotate(0deg); /* Safari and Chrome */
/}
.glavna p{
font-family: arial;
font-size: 12px;
margin-left: 200px;
margin-bottom: 4px;
line-height: 70%;
}
.onas{
width:346px;
height:192px;
background: white;
position: absolute;
box-shadow: 5px 5px 13px #181818;
transform: rotate(10deg);
-ms-transform: rotate(10deg); /* IE 9 */
-webkit-transform: rotate(10deg); /* Safari and Chrome */
}
.onas h1{
margin-left: 25px;
color: green;
}
.onas p, .onas a{
font-family: arial;
font-size: 12px;
margin-left: 200px;
margin-bottom: 4px;
line-height: 100%;
text-decoration: none;
}
.ocenjevanje{
width:346px;
height:192px;
background: white;
position: absolute;
box-shadow: 5px 5px 13px #181818;
transform: rotate(-5deg);
-ms-transform: rotate(-5deg); /* IE 9 */
-webkit-transform: rotate(-5deg); /* Safari and Chrome */
}
.ocenjevanje h1{
margin-left: 25px;
color: green;
}
.ocenjevanje p, .ocenjevanje a{
font-family: arial;
font-size: 12px;
margin-left: 200px;
margin-bottom: 4px;
line-height: 100%;
text-decoration: none;
}
.svetovanje{
width:346px;
height:192px;
background: white;
position: absolute;
box-shadow: 5px 5px 13px #181818;
transform: rotate(20deg);
-ms-transform: rotate(20deg); /* IE 9 */
-webkit-transform: rotate(20deg); /* Safari and Chrome */
}
.svetovanje h1{
margin-left: 25px;
color: green;
}
.svetovanje p, .svetovanje a{
font-family: arial;
font-size: 12px;
margin-left: 200px;
margin-bottom: 4px;
line-height: 100%;
...