JSFiddle - React, Tailwind, and code Playground

by Zonicpl

HTML

<div id="slider">
</div>
<div id="box">
Lorem Ipsum jest tekstem stosowanym jako przykładowy wypełniacz w przemyśle poligraficznym. Został po raz pierwszy użyty w XV w. przez nieznanego drukarza do wypełnienia tekstem próbnej książki
</div>
<div id="box1">
  Lorem Ipsum jest tekstem stosowanym jako przykładowy wypełniacz w przemyśle poligraficznym. Został po raz pierwszy użyty w XV w. przez nieznanego drukarza do wypełnienia tekstem próbnej książki
</div>
<div id="box2">
  Lorem Ipsum jest tekstem stosowanym jako przykładowy wypełniacz w przemyśle poligraficznym. Został po raz pierwszy użyty w XV w. przez nieznanego drukarza do wypełnienia tekstem próbnej książki
</div>



<div id="cien"></div>
<div id="duzy">
<div id="newsletter">
</div>
</div>
<div id="akcja">
</div>
<div id="footerm">

</div>
<div id="stopka">
<div id="strzalka">
</div>
</div>

CSS

body {
 background:url(../images/background.png);
 color:#000;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
}

#wrapper {
 margin:0 auto;
 width:1280px; 
}

#menu { 
width:1348px;
height:111px;
background:url(../images/menu.png)center;
}
#menu ul{
font-size:18px;
color:#000;
list-style:none;
text-shadow:1px 1px 1px #000;
	margin-top:0px;
	margin-left:700px;
}
#menu ul li{
text-align:center;
	width:170px;
		float:left;
			line-height:17px;
	display:block;
			}
			#menu ul li a{
	width:170px;
	height:20px;
	display:block;
	text-decoration:none;
	color:#000;
	padding-bottom:25px;
	text-align:center;
}
#slogan{
margin-left:150px;
}
#cien {
background:url(../images/cien.png) center;
margin-left:130px;
width:947px;
height:15px;
}

#slider {
width:1348px;
height:349px;
background:url(../images/slider.png) center;


}
#box {
width:312px;
height:213px;
background: #aaa url(../images/box.png);
margin-top:15px;
display: inline-block;
margin-left:145px;
}
#box1 {
width:312px;
height:213px;
background: #aaa url(../images/box.png);
margin-top:15px;
display: inline-block;
}
#box2 {
width:312px;
height:213px;
background: #aaa url(../images/box.png);
margin-top:15px;
display: inline-block;
}
#duzy {
width:632px;
height:213px;
background: #ccc url(../images/duzy.png);

margin-left:145px;
}
#newsletter{
width:312px;
height:213px;
background:url(../images/box.png);

margin-left:650px;
	display:block;
}
#slider{
  background: #432134;
}
#akcja{
width:962px;
height:137px;
background: #555 url(../images/akcja.png);
margin-top:15px;
margin-left:145px;
}
/*  stopka  */
#footerm{
background: #222 url(../images/menu-stopka.png);
width:1348px;
height:266px;
margin-top:15px;
}
#stopka{
background: #333 url(../images/stopka.png);
width:1348px;
height:47px;
}
/* ikonki */
#strzalka{
background: #444...