"simple portfolio"
Bootstrap 3.2.0 Snippet by ibrahimyilmaz

Post to Facebook Tweet this

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div id="gal">
<nav class="galnav">
<ul>
<li>
<input type="radio" name="btn" value="one"/>
<label for="btn" class="entypo-right-open-big"></label>
<figure>
<img src="https://dl.dropboxusercontent.com/u/330966/static/team/new/tim_biskup.jpg"/>
<figcaption>
<h4>Tim Biskup</h4>
<nav role='navigation'>
<p>share this with your friends</p>
<ul>
<li><a href="#" class="entypo-facebook-squared"></a></li>
<li><a href="#" class="entypo-twitter"></a></li>
<li><a href="#" class="entypo-gplus"></a></li>
</ul>
</nav>
</figcaption>
</figure>
</li>
<li>
<input type="radio" name="btn" value="two" checked="checked"/>
<label for="btn" class="entypo-right-open-big"></label>
<figure>
<img src="https://dl.dropboxusercontent.com/u/330966/static/team/new/brecht_vandenbroucke.jpg"/>
<figcaption>
<h4>Brecht Vandenbroucke</h4>
<nav role='navigation'>
<p>share this with your friends</p>
<ul>
<li><a href="#" class="entypo-facebook-squared"></a></li>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
@import url(http://fonts.googleapis.com/css?family=Titillium+Web:300);
@import url(http://weloveiconfonts.com/api/?family=entypo);
*, *:before, *:after {
margin:0;
padding:0;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
#gal {
position:relative;
width:600px;
height:300px;
margin:0 auto;
top:100px;
background:white;
-webkit-transform:translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
#gal ul {list-style-type:none;}
input[type="radio"] {
position:absolute;
left:0;
display:block;
width:40px;
height:75px;
border:0;
outline:none;
cursor:pointer;
opacity:0;
z-index:9;
}
input[value="one"] {top:0;}
input[value="two"] {top:75px;}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Login and Register Modal
Simple Vertical timeline
Simple white navbar
BS4 clean & simple invoice template

Questions / Comments: