[Table] Text with top image

POSTED: Sun Nov 15, 2015 1:41 pm

I was messing around with coding and I thought I'd share the table I made with everyone. Enjoy! :)

Name Here
some nice lyrics here
Form | Time | Location
This is where you would write something out of character.
WORD COUNT
000

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis sodales egestas. Integer lacus turpis, suscipit et hendrerit non, auctor sed nisi. Morbi et fringilla ipsum. Integer pellentesque leo felis. Curabitur hendrerit dolor ac lorem iaculis condimentum. Integer non ante neque, ut dapibus lectus. Cras bibendum dolor neque, eu condimentum nunc. Sed nec eros quis leo venenatis consequat eget eu quam. Phasellus et ante risus. Aliquam erat volutpat. Nulla auctor, nunc nec hendrerit tincidunt, risus enim hendrerit diam, sit amet aliquet justo ipsum at nisl. Proin semper fermentum dui, tristique venenatis risus eleifend dignissim. "Donec non enim felis, eu elementum diam. Suspendisse aliquam." Eros nec commodo ultricies, dui metus adipiscing nulla, in varius justo quam eget massa. Nulla venenatis tempus neque, non semper libero mattis ut. Morbi pharetra fringilla erat a ultricies.

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras tincidunt ipsum eget ipsum pellentesque interdum. Nulla porta cursus arcu, in adipiscing justo euismod in. Fusce varius suscipit sapien, eget vulputate lectus tempus a. Nunc egestas consectetur rutrum. Vivamus tincidunt pellentesque nulla, ac tristique velit lobortis at. Nulla vitae nisi quis nisi accumsan pretium. Praesent dapibus tellus in nunc fringilla tincidunt.

Morbi quis ligula mi, non eleifend erat. Quisque nec orci in sem accumsan laoreet. Phasellus vitae nibh ac mauris fermentum vestibulum a dapibus ante. Praesent libero purus, rutrum non laoreet sed, eleifend ut sem. Nam justo nibh, congue ac adipiscing sit amet, euismod non diam. Proin dignissim arcu sit amet eros facilisis ullamcorper. Donec id nulla odio.

Template by Andi


Code: Select all
[html]<div class="Free1"><div class="Free1-name">Name Here</div>
<div class="Free1-lyrics">some nice lyrics here</div>
<div class="Free1-img"></div>
<table class="Free1-bar"><tr><td class="Free1-ooc"><center>Form | Time | Location</center>This is where you would write something out of character.</td><td class="Free1-word">WORD COUNT<br>
000</td></tr></table>
<div class="Free1-in">

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis sodales egestas. Integer lacus turpis, suscipit et hendrerit non, auctor sed nisi. Morbi et fringilla ipsum. Integer pellentesque leo felis. Curabitur hendrerit dolor ac lorem iaculis condimentum. Integer non ante neque, ut dapibus lectus. Cras bibendum dolor neque, eu condimentum nunc. Sed nec eros quis leo venenatis consequat eget eu quam. Phasellus et ante risus. Aliquam erat volutpat. Nulla auctor, nunc nec hendrerit tincidunt, risus enim hendrerit diam, sit amet aliquet justo ipsum at nisl. Proin semper fermentum dui, tristique venenatis risus eleifend dignissim. <b>"Donec non enim felis, eu elementum diam. Suspendisse aliquam."</b> Eros nec commodo ultricies, dui metus adipiscing nulla, in varius justo quam eget massa. Nulla venenatis tempus neque, non semper libero mattis ut. Morbi pharetra fringilla erat a ultricies.

<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras tincidunt ipsum eget ipsum pellentesque interdum. Nulla porta cursus arcu, in adipiscing justo euismod in. Fusce varius suscipit sapien, eget vulputate lectus tempus a. Nunc egestas consectetur rutrum. Vivamus tincidunt pellentesque nulla, ac tristique velit lobortis at. Nulla vitae nisi quis nisi accumsan pretium. Praesent dapibus tellus in nunc fringilla tincidunt.

<p>Morbi quis ligula mi, non eleifend erat. Quisque nec orci in sem accumsan laoreet. Phasellus vitae nibh ac mauris fermentum vestibulum a dapibus ante. Praesent libero purus, rutrum non laoreet sed, eleifend ut sem. Nam justo nibh, congue ac adipiscing sit amet, euismod non diam. Proin dignissim arcu sit amet eros facilisis ullamcorper. Donec id nulla odio.</p>

<div class="Free1-credit">Template by Andi</div>
</div></div>

<style type="text/css">
.Free1 {width:560px; padding:15px 15px 15px; margin:0px auto; text-align:justify; }

.Free1-name {font-family: 'Tulpen One', cursive; font-size:50px; line-height:40px; letter-spacing:2px; text-align:center; color:#464a51; text-shadow:#c3c3c3 1px 1px 4px; }

.Free1-lyrics {font-family: 'Ruthie', cursive; font-size:32px; line-height: 15px; letter-spacing:0px; text-align:center; color:#625856; text-shadow:#464a51 1px 1px 4px; padding-bottom: 0px;}

.Free1-img {width:559px; height:105px; background-image:url('https://i.imgur.com/qz8FHql.jpg'); background-position:top center; background-repeat:no-repeat; border:0px; margin 0px auto; border-radius: 15px 15px 0px 0px;}

.Free1-bar {width:100%; margin:0px auto; border-collapse:collapse;}

.Free1-ooc {text-align:left; color: #fff; font-family: 'Open Sans', sans-serif; margin:0px auto;  font-size:12px; padding:10px; border-right:2px solid#fff; background-color:#625856; width:75%;}

.Free1-word {text-align:center; background-color:#625856; color: #fff; font-family: 'Glass Antiqua', cursive; margin:0px auto; font-size:16px; padding:10px; border-left:2px solid#fff; width:25%; vertical-align:middle;}

.Free1-in {padding:10px 5px 10px 5px; margin:0px auto;}

.Free1 p {text-indent:25px; color:#000; font-family: 'Open Sans', sans-serif; font-size:14px; margin:0px auto; padding:5px;}

.Free1-credit {text-align:center; background-color:#625856; color: #fff; font-family: verdana, sans-serif; margin:0px auto; font-size:12px; padding:10px; width:100%;}

</style>
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Glass+Antiqua' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Ruthie' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Tulpen+One' rel='stylesheet' type='text/css'>
[/html]

User avatar
Andi

POSTED: Sun Nov 15, 2015 1:45 pm

Also, I'll take a few requests if anyone who isn't good at code would like a table :)

User avatar
Andi

POSTED: Sun Nov 15, 2015 1:48 pm

That looks absolutely wonderful, Andi! I don't really have a preference for tables, other than really, really liking text tables, but can I request one for Conan? I'm horrid at coding. Lol.

Conan

User avatar
Dread
Luperci

POSTED: Sun Nov 15, 2015 1:52 pm

Thanks Dread! I can whip one up for you :)

User avatar
Andi

POSTED: Sun Nov 15, 2015 1:53 pm

Thanks a ton. <3

Conan

User avatar
Dread
Luperci

POSTED: Sun Nov 15, 2015 1:57 pm

This is lovely
Kentaro Lykoi
They say I’m a criminal cause I walk in a different way

POSTED: Sun Nov 15, 2015 2:12 pm

Might I get one for Fiora, your coding is simply beautiful. If my request is not welcome, please ignore it! <3
Mistfell Vale
Crowstooth
User avatar
Lullaby
Luperci Mate to Ezra Step out on the leaves of the lily and shine
PAINT ME BEAUTIFUL

POSTED: Sun Nov 15, 2015 2:25 pm

Thanks Marie!

And no problem at all, Lullaby!~

User avatar
Andi

POSTED: Sun Nov 15, 2015 4:21 pm

i love this template <3 its a nice mix of a text table and a graphical one! if you're still doing them, can i request one? for abi :)

POSTED: Sun Nov 15, 2015 4:47 pm

I'd be interested in one for Pisces.
Cartier Inferni
fideli certa merces



Inferni
DEAD
User avatar
Luperci
fire on the hillside
sinner

Templates