Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras a suscipit neque. Fusce euismod eros consectetur tortor pretium, ut molestie lectus vehicula.
There is nothing permanent except change.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras a suscipit neque. Fusce euismod eros consectetur tortor pretium, ut molestie lectus vehicula. Etiam ultrices erat odio, nec fringilla velit scelerisque ac. Duis in vulputate nisi. Sed eget dui quis mi commodo auctor in a urna. Integer porta bibendum quam ut efficitur. Nullam ut ante at nisl tempor egestas. Quisque ut pellentesque orci, vestibulum vehicula augue. Phasellus at turpis vel purus vulputate vulputate.Phasellus varius, lacus eu facilisis imperdiet, nunc elit viverra dolor, fermentum efficitur ante metus vel odio. Ut vitae mauris laoreet, porttitor ante a, venenatis dui. In id congue justo. Etiam mollis molestie sodales. Aliquam pretium in sapien quis malesuada. Nam semper id augue eu porttitor. Phasellus mauris elit, porttitor in orci nec, dapibus posuere sem.Quisque a ante nec neque lobortis sollicitudin sed sed dolor. Pellentesque venenatis iaculis neque, a gravida leo pellentesque ornare. Aliquam eget vehicula ex. Nam viverra sagittis massa, eget dictum dolor fermentum eget. Sed tincidunt sit amet eros vitae euismod. Nam faucibus, mauris ut elementum laoreet, ipsum diam pharetra purus, non aliquet mi nibh sit amet diam. Maecenas porta sodales ligula, id convallis nunc euismod ut. Proin augue sem, vehicula quis dictum non, ullamcorper ac tortor. Duis tempus leo vel felis vulputate gravida. Vivamus tincidunt venenatis dui eget convallis. Aenean tortor augue, tempus eu ante in, pulvinar dignissim tellus. Nullam quis nibh laoreet, venenatis lacus vitae, hendrerit odio. Nam consectetur nisl at mi ultrices, sed laoreet ipsum elementum.
Donec eget nisl justo.Etiam malesuada leo a ipsum blandit vehicula. Suspendisse nec posuere ex. Nullam vestibulum velit dui, ac commodo lorem bibendum quis. Phasellus tincidunt dapibus mattis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam justo ipsum, ultricies at nisi non, blandit pretium dui. Fusce vitae fringilla sem. Vivamus in lacinia neque. Maecenas luctus convallis libero, tincidunt dignissim sem sollicitudin id. Integer non metus id lacus imperdiet euismod in congue sapien. Donec aliquet ullamcorper nulla, quis imperdiet lorem interdum non. Sed porttitor metus magna, et rhoncus ex eleifend ut.
@Tagname
Des notes ici si vous voulez
- Code:
<link href="https://fonts.googleapis.com/css?family=Montserrat:900|Source+Sans+Pro" rel="stylesheet"> <style>:root {--accent-color: #04C984;}.thread {width: 550px;margin: auto;background: #fff;display: flex;font-family: 'Source Sans Pro', sans-serif;position:relative;}.thread * { box-sizing: content-box; }.thread > div:first-child {background: var(--accent-color);min-width: 118px;max-width: 118px;justify-content: flex-end;display: flex;flex-direction: column;padding: 10px;}.thread > div:first-child p {margin: 0 0 10px;padding: 5px;font-family: 'Montserrat', sans-serif;text-transform: uppercase;font-size: 6px;text-align: justify;letter-spacing: 1px;color: #fff;line-height: 180%;}.thread > div:nth-child(2) {text-align: justify;font-size: 11px;padding: 35px 40px 25px;}.thread > div:nth-child(2) > div {margin-top: 20px;border-top: 1px solid var(--accent-color);text-transform: uppercase;font-size: 9px;}.thread > div:nth-child(2) > div b {border-top: 3px solid var(--accent-color);padding: 0 3px;}.thread-icon {padding: 9px;background: #fff;width: 100px;}.thread-icon img {width: 100px;height: 100px;vertical-align: middle;}.thread h2 {margin: 0 0 40px;font-weight: 900;font-size: 25px;line-height: 25px;font-family: 'Montserrat', sans-serif;color: #000;text-align: left;position: relative;}.thread h2::after {content: "";width: 100px;height: 5px;background: var(--accent-color);position: absolute;bottom: -15px;left: 0;}.thread-credit {position: absolute;bottom:-15px;left:0;}.thread-credit a {font-size:8px;text-transform:uppercase;letter-spacing:1px;color:var(--accent-color)!important;}</style>
<div class="thread"><div><!--
--><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras a suscipit neque. Fusce euismod eros consectetur tortor pretium, ut molestie lectus vehicula.</p><!--
--><div class="thread-icon"><img src="http://via.placeholder.com/100x100"></div></div><!--
--><div><h2>There is nothing permanent except change.</h2><!--
-->Texte ici<!--
--><div><b>@Tagname</b><div>Des notes ici si vous voulez</div></div></div><div class="thread-credit"><a href="http://terrible.forumactif.org/" target="_blank">Awful</a></div></div>
|
|
|