HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Kažkas tokio</title>
<style>
* {
margin : 0;
padding : 0;
}
body {
margin : 0;
padding : 0;
overflow-x : hidden;
height : 100%;
font-family : Sans-serif;
line-height : 1.5em;
}
h1 {
text-align : center;
}
#main {
position : relative;
overflow : auto;
width : 100%;
height : auto;
min-height : 200px;
}
#wrap {
overflow : hidden;
background : #0f0;
margin : 0 auto;
display : block;
width : 90%;
position : relative;
}
#main p {
text-align : justify;
display : block;
width : 47%;
position : relative;
margin : 0 0 2% 2%;
float : left;
}
#foto {
list-style : none;
display : block;
position : relative;
background : #050;
width : 100%;
margin-left : 2%;
}
li {
width : 30%;
float : left;
margin : 1%;
position : relative;
display : block;
}
img {
display : block;
width : 100%;
height : auto;
}
@media screen and (max-width:480px) {
#main p {
width : 96%;
float : none;
margin : 0 0 2% 2%;
}
}
</style>
</head>
<body>
<div id="wrap">
<div id="main">
<h1>Užduotis</h1>
<p>
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
</p>
<p>
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
</p>
<div class="fot">
<ul id="foto">
<li><img src="http://burundukas.lt/photos/burundukas13.jpg" alt="aaa"></li>
<li><img src="http://burundukas.lt/photos/burundukas13.jpg" alt="aaa"></li>
<li><img src="http://burundukas.lt/photos/burundukas13.jpg" alt="aaa"></li>
</ul>
</div>
</div>
</div>
</body>
</html>
