Skip to content

Instantly share code, notes, and snippets.

@taepeach
Last active December 23, 2018 11:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save taepeach/5d4c2b737da464ad0d213edae51bd23f to your computer and use it in GitHub Desktop.
Save taepeach/5d4c2b737da464ad0d213edae51bd23f to your computer and use it in GitHub Desktop.
<div style="width:100%;margin:50px 0px;font-family:calibri;font-size:8px;line-height:10px;letter-spacing:1px;text-align:justify;color:#444;text-transform:uppercase;">
<div style="width:660px;height:420px;margin:0px auto;background:#eee;">
<div style="width:630px;height:390px;padding:15px;background:#eee;">
<div style="width:600px;height:360px;float:left;padding:14px;background:#fff;border:1px solid #fff;">
<div style="width:600px;height:360px;float:left;"><img alt="" src="https://i.imgur.com/NAlx6Jb.png" style="width:600px;height:360px;" /></div>
<div style="width:600px;height:360px;float:left;margin-top:-360px;overflow:hidden;">
<div style="width:617px;height:360px;float:left;overflow:auto;">
<div style="width:600px;height:360px;float:left;">
<div style="width:600px;float:left;margin-top:150px;font-family:'times new roman';font-size:40px;color:#fff;line-height:40px;text-align:center;text-transform:lowercase;"><em><strong>acedia</strong></em></div>
<div style="width:600px;float:left;font-size:8px;color:#888;text-align:center;"><strong>scroll down</strong></div>
</div>
<div style="width:570px;height:330px;float:left;padding:15px;opacity:.95;">
<div style="width:160px;height:310px;float:left;padding:10px;background:#fafafa;">
<div style="width:160px;height:160px;float:left;"><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:160px;height:160px;" /></div>
<div style="width:160px;float:left;padding:5px 0px;margin:5px 0px;background:#cbc6d1;font-size:9px;color:#fff;text-align:center;"><strong>about me</strong></div>
<div style="width:160px;height:115px;float:left;overflow:hidden;">
<div style="width:177px;height:115px;float:left;overflow:auto;">
<div style="width:160px;float:left;padding:2px 0px;border-top:1px dashed #ccc;border-bottom:1px dashed #ccc;"><strong>ALIAS:</strong>&nbsp;notes notes</div>
<div style="width:160px;float:left;padding:2px 0px;border-bottom:1px dashed #ccc;"><strong>country:</strong> notes notes</div>
<div style="width:160px;float:left;padding:2px 0px;border-bottom:1px dashed #ccc;"><strong>biases:</strong> notes notes</div>
<div style="width:160px;float:left;padding:2px 0px;border-bottom:1px dashed #ccc;"><strong>HOBBIES:</strong>&nbsp;notes notes</div>
<div style="width:160px;float:left;margin-top:5px;">Lorem ipsum dolor sit amet, ei sea diam ipsum fierent, pri eu essent sensibus consectetuer. Id sea justo semper elaboraret, commune facilisi in sed. Mei tation feugiat menandri ex, at aeque moderatius adversarium per. Dicta fabulas vix an, eu impedit probatus per. Ea nec vero elitr pertinacia, ad mei vivendo neglegentur. Ea ius tritani deleniti adipisci, duo ei luptatum recteque prodesset, cu eam posse dicat tantas.</div>
</div>
</div>
</div>
<div style="width:170px;height:310px;float:left;padding:10px;background:#fafafa;margin:0px 10px;">
<div style="width:170px;float:left;padding:5px 0px;background:#cbc6d1;font-size:9px;color:#fff;text-align:center;"><strong>FRIENDS</strong></div>
<div style="width:170px;height:275px;float:left;overflow:hidden;margin-top:10px;">
<div style="width:187px;height:275px;float:left;overflow:auto;">
<div style="width:170px;float:left;"><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:46px;margin:3px;height:46px;border:2px solid rgb(203,198,209);" /><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:46px;margin:3px;height:46px;border:2px solid rgb(203,198,209);" /><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:46px;margin:3px;height:46px;border:2px solid rgb(203,198,209);" /><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:46px;margin:3px;height:46px;border:2px solid rgb(203,198,209);" /><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:46px;margin:3px;height:46px;border:2px solid rgb(203,198,209);" /><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:46px;margin:3px;border:2px solid rgb(203,198,209);height:46px;" /></div>
<div style="width:170px;float:left;margin-top:5px;"><strong><span style="background-color:#cbc6d1;line-height:14px;padding:2px 10px;color:#fff;">username</span></strong> Lorem ipsum dolor sit amet, ei sea diam ipsum fierent, pri eu essent sensibus consectetuer. Id sea justo semper elaboraret, commune facilisi in sed. Mei tation feugiat menandri ex, at aeque moderatius adversarium per.</div>
<div style="width:170px;float:left;margin-top:5px;"><strong><span style="background-color:#cbc6d1;line-height:14px;padding:2px 10px;color:#fff;">username</span></strong> Lorem ipsum dolor sit amet, ei sea diam ipsum fierent, pri eu essent sensibus consectetuer. Id sea justo semper elaboraret, commune facilisi in sed. Mei tation feugiat menandri ex, at aeque moderatius adversarium per.</div>
<div style="width:170px;float:left;margin-top:5px;"><strong><span style="background-color:#cbc6d1;line-height:14px;padding:2px 10px;color:#fff;">username</span></strong> Lorem ipsum dolor sit amet, ei sea diam ipsum fierent, pri eu essent sensibus consectetuer. Id sea justo semper elaboraret, commune facilisi in sed. Mei tation feugiat menandri ex, at aeque moderatius adversarium per.</div>
<div style="width:170px;float:left;margin-top:5px;"><strong><span style="background-color:#cbc6d1;line-height:14px;padding:2px 10px;color:#fff;">username</span></strong> Lorem ipsum dolor sit amet, ei sea diam ipsum fierent, pri eu essent sensibus consectetuer. Id sea justo semper elaboraret, commune facilisi in sed. Mei tation feugiat menandri ex, at aeque moderatius adversarium per.</div>
</div>
</div>
</div>
<div style="width:160px;height:310px;float:left;padding:10px;background:#fafafa;">
<div style="width:160px;height:50px;float:left;">
<div style="width:50px;height:50px;float:left;border:1px solid #ccc;">
<div style="width:20px;height:20px;float:left;margin-left:14px;margin-top:14px;border-radius:100%;overflow:hidden;"><iframe frameborder="0" height="20" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/325661098&amp;color=%23ff5500&amp;&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;show_teaser=true" width="100%"></iframe></div>
</div>
<div style="width:105px;height:50px;float:left;border:1px solid #ccc;margin-left:-1px;">
<div style="width:100px;height:9px;float:left;margin-left:5px;margin-top:10px;font-size:8px;line-height:9px;text-align:justify;"><b>now playing</b></div>
<div style="width:100px;height:9px;float:left;margin-left:5px;font-size:8px;line-height:9px;text-align:justify;">so far away</div>
<div style="width:100px;height:9px;float:left;margin-left:5px;font-size:8px;line-height:9px;text-align:justify;">suga, jk, jin</div>
</div>
</div>
<div style="width:160px;float:left;padding:5px 0px;background:#cbc6d1;margin-top:10px;font-size:9px;color:#fff;text-align:center;"><strong>stories</strong></div>
<div style="width:160px;height:210px;float:left;margin-top:10px;">
<div style="width:160px;height:210px;float:left;overflow:hidden;">
<div style="width:177px;height:210px;float:left;overflow:auto;">
<div style="width:160px;float:left;">
<div style="width:40px;float:left;margin-right:5px;"><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:40px;height:40px;" /></div>
<div style="width:115px;float:left;font-family:arial;font-weight:bold;font-size:18px;letter-spacing:0px;line-height:20px;text-align:justify;">STORY</div>
<div style="width:115px;float:left;font-family:arial;font-weight:bold;font-size:18px;letter-spacing:0px;line-height:20px;text-align:justify;">TITLE</div>
<div style="width:160px;float:left;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
<div style="width:160px;float:left;margin:5px 0px;">
<div style="width:auto;float:left;padding:2px 10px;background:#cbc6d1;color:#fff;text-align:center;">read more</div>
</div>
<div style="width:160px;float:left;line-height:12px;text-align:right;border-top:1px dashed #ccc;">#tags #tags #tags</div>
</div>
<div style="width:160px;float:left;margin-top:10px;">
<div style="width:40px;float:left;margin-right:5px;"><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:40px;height:40px;" /></div>
<div style="width:115px;float:left;font-family:arial;font-weight:bold;font-size:18px;letter-spacing:0px;line-height:20px;text-align:justify;">STORY</div>
<div style="width:115px;float:left;font-family:arial;font-weight:bold;font-size:18px;letter-spacing:0px;line-height:20px;text-align:justify;">TITLE</div>
<div style="width:160px;float:left;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
<div style="width:160px;float:left;margin:5px 0px;">
<div style="width:auto;float:left;padding:2px 10px;background:#cbc6d1;color:#fff;text-align:center;">read more</div>
</div>
<div style="width:160px;float:left;line-height:12px;text-align:right;border-top:1px dashed #ccc;">#tags #tags #tags</div>
</div>
<div style="width:160px;float:left;margin-top:10px;">
<div style="width:40px;float:left;margin-right:5px;"><img alt="" src="https://i.imgur.com/DK3Mhpr.png" style="width:40px;height:40px;" /></div>
<div style="width:115px;float:left;font-family:arial;font-weight:bold;font-size:18px;letter-spacing:0px;line-height:20px;text-align:justify;">STORY</div>
<div style="width:115px;float:left;font-family:arial;font-weight:bold;font-size:18px;letter-spacing:0px;line-height:20px;text-align:justify;">TITLE</div>
<div style="width:160px;float:left;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
<div style="width:160px;float:left;margin:5px 0px;">
<div style="width:auto;float:left;padding:2px 10px;background:#cbc6d1;color:#fff;text-align:center;">read more</div>
</div>
<div style="width:160px;float:left;line-height:12px;text-align:right;border-top:1px dashed #ccc;">#tags #tags #tags</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="width:100%;float:left;margin-top:10px;font-size:6px;letter-spacing:2px;color:#aaa;text-align:center;"><a href="https://www.asianfanfics.com/story/view/1325741/"><span style="color:#aaa;"><span style="padding-bottom:4px;border-bottom:1px dotted #aaa;">coded by ambrozia | iridescent layouts 2018.</span></span></a></div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment