Line 1: | Line 1: | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
<style type="text/css"> | <style type="text/css"> | ||
*, | *, | ||
Line 15: | Line 6: | ||
} | } | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
.photo-stack-grid { | .photo-stack-grid { | ||
Line 58: | Line 45: | ||
} | } | ||
− | + | .sspan { | |
text-overflow: ellipsis; | text-overflow: ellipsis; | ||
white-space: nowrap; | white-space: nowrap; | ||
Line 143: | Line 130: | ||
<img src="https://static.igem.org/mediawiki/2017/7/71/T--Shanghaitech--workssdcsdcsdcsdhop1.jpg" alt="Chen Luonan" /> | <img src="https://static.igem.org/mediawiki/2017/7/71/T--Shanghaitech--workssdcsdcsdcsdhop1.jpg" alt="Chen Luonan" /> | ||
</figure> | </figure> | ||
− | <span>Chen Luonan</span> | + | <span class="sspan">Chen Luonan</span> |
<p>Computational and System Biology</p> | <p>Computational and System Biology</p> | ||
</a> | </a> | ||
Line 152: | Line 139: | ||
<img src="https://static.igem.org/mediawiki/2017/5/5e/T--Shanghaitech--wasdfcsdcsdcwdorkshop1.jpg" alt="Wang Yong" /> | <img src="https://static.igem.org/mediawiki/2017/5/5e/T--Shanghaitech--wasdfcsdcsdcwdorkshop1.jpg" alt="Wang Yong" /> | ||
</figure> | </figure> | ||
− | <span>Wang Yong, Synthetic Biology</span> | + | <span class="sspan">Wang Yong, Synthetic Biology</span> |
</a> | </a> | ||
</li> | </li> | ||
Line 160: | Line 147: | ||
<img src="https://static.igem.org/mediawiki/2017/2/25/T--Shanghaitech--wasdfcsdcsdcwdoxcaddcrkshop1.jpg" alt="Yuan Bo" /> | <img src="https://static.igem.org/mediawiki/2017/2/25/T--Shanghaitech--wasdfcsdcsdcwdoxcaddcrkshop1.jpg" alt="Yuan Bo" /> | ||
</figure> | </figure> | ||
− | <span>Yuan Bo, Electronic Engineering</span> | + | <span class="sspan">Yuan Bo, Electronic Engineering</span> |
</a> | </a> | ||
</li> | </li> | ||
</ul> | </ul> | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− |
Revision as of 04:59, 1 November 2017
<style type="text/css">
- ,
- before,
- after {
box-sizing: border-box;
}
.photo-stack-grid {
list-style: none; margin: 0; padding: 0; text-align: center;
}
.photo-stack-grid:after {
content: " "; display: table; clear: both;
}
.photo-stack-grid li {
width: 46%; float: left; margin: 0 8% 2.8em 0;
}
.photo-stack-grid li:nth-child(2n) {
margin-right: 0;
}
/* remember to clear first item in each row */
.photo-stack-grid li:nth-child(2n + 1) {
clear: left;
}
.photo-stack-grid a {
display: block; color: #333; text-decoration: none; font: 600 0.8em/1.3 "Open Sans", sans-serif;
}
.sspan {
text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block;
}
.photo-stack {
position: relative; margin: 0 4% 2em; display: block;
}
.photo-stack:before, .photo-stack:after, .photo-stack img {
display: block; background: #ccc; border: 5px solid #fff; border-radius: 3px; padding: 1px;
}
.photo-stack:before, .photo-stack:after {
content: ; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: #969289; box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.3); transform: rotate(6deg);
}
.photo-stack:after {
transform: rotate(10deg); z-index: -1;
}
.photo-stack img {
transform: rotate(0deg); width: 100%; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.2), 0 14px 18px -12px rgba(0, 0, 0, 0.9);
}
.ie8 .photo-stack:before, .ie8 .photo-stack:after {
display: none;
}
@media (min-width: 620px) {
body { font-size: 120%; } .photo-stack-grid li { width: 19%; } .photo-stack-grid li:nth-child(2n) { margin-right: 8%; } .photo-stack-grid li:nth-child(2n + 1) { clear: none; } .photo-stack-grid li:nth-child(4n) { margin-right: 0; } .photo-stack-grid li:nth-child(4n + 1) { clear: left; }
} </style>
Click pictures to see details
-
<a href="https://2017.igem.org/Team:Shanghaitech/ChenLuonan">
<figure class="photo-stack">
<img src="" alt="Chen Luonan" />
</figure>
Chen Luonan
Computational and System Biology
</a>
- <a href="https://2017.igem.org/Team:Shanghaitech/WangYong"> <figure class="photo-stack"> <img src="" alt="Wang Yong" /> </figure> Wang Yong, Synthetic Biology </a>
- <a href="#d"> <figure class="photo-stack"> <img src="" alt="Yuan Bo" /> </figure> Yuan Bo, Electronic Engineering </a>