JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div class="wrapper">
<div class="content">Ваш контент</div>
<div class="footer">
<div class="footer-wrap">
<div class="footer-left">
<ul>
<li><a href="#">Правила пользования</a></li>
<li><a href="#">Политика безопасности</a></li>
<li><a href="#">Связаться</a></li>
</ul>
</div>
<div class="footer-right">
<ul>
<li><a href="#">Приложение для iPhone</a></li>
<li><a href="#">Приложение для Android</a></li>
<li>2013 © job for me</li>
</ul>
</div>
</div>
</div>
</div>
</body>
CSS
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
html{
}
body {
line-height: 1;
min-height: 100%;
background: #bdc3c7;
z-index: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
html, body {
min-height: 100%;
height: 100%;
}
body:after {
position: fixed;
left: 0;
right: 50%;
top: 0;
bottom: 0;
background: #ecf0f1 repeat right top;
content: "";
z-index: 0;
}
.wrapper{
position: relative;
min-height:100%;
}
.content{
}
.footer{
position: absolute;
bottom:...