Tabula Rasa Plain: May Flowers

[stellastars]

Name: May Flowers
Layout Style: Tabula Rasa Plain
Best View: 1024x768 and up
Browser(s) Compatible: Tested in Chrome1, Firefox3, IE8, & Safari on Windows XP and Firefox3 and Midori on Ubuntu Hardy.
Account Levels: Tested on a free journal, should work for all levels.
Notes: If you have any questions about the directions, please ask.
Credit: stellastars in user info, please.


Preview: Click image for full-size preview.










Live Previews:Peaches & Green, DW Pink, and Lavender Blossom.

DIRECTIONS for DREAMWIDTH:
1. Go to select journal style.
2. In section "2. Select a New Theme" click "All" in the menu at the left.
3. Choose "Tabula Rasa Plain."
4. Continue on to "3. Choose a Page Setup" and make your selection for columns, then click "Customize Selected Theme." Recommendation: If viewing on a 1200x800 screen, select "2 Column (sidebar on right)" or "3 Column (sidebars on right)." If viewing on a 1024x768 screen, select "2 Column (sidebar on right)."
5. Adjust Presentation, Modules, Text, and Link List as desired.
6. Click on "Custom CSS" in the menu on the left.
7. Leave "Use layout's stylesheet(s)" checked and leave "Use an external stylesheet" blank.
8. Copy the Code from the textbox below and paste in the "Use embedded CSS" box.
/* May Flowers */ /* Style - Tabula Rasa - Plain */ /* Page Setup - 1, 2, or 3 Columns */ /* Made by stellastars.livejournal.com = stellastars.insanejournal.com = stellastars.dreamwidth.org */ html {font-size:16px;} #lj_controlstrip {border-bottom:1px solid #535353;} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search {color:#fff !important;} #lj_controlstrip_user a, #lj_controlstrip_actionlinks a, #lj_controlstrip_search a {text-decoration:underline;} blockquote {font-style:italic;} div.ContextualPopup, div.ContextualPopup .Userpic {border-width:0px !important;} body {font-family: arial, sans-serif; font-size:0.8em; margin:0 80px !important;} h1, h2, h3, h4, h5, h6, #footer, .comment-title {font-family:"trebuchet ms", verdana, arial, sans-serif;} #primary a {font-weight:bold;} .entry-interaction-links, .comment-interaction-links, .module-header, .module-userprofile .module-header, .journal-name, .journal-website-name, .module-navlinks, .module-calendar .module-content a, .module-powered {font-size:1.2em !important; font-weight:bold; font-family:"trebuchet ms", verdana, arial, sans-serif;} #header {padding:23px 15px 15px 15px;} #header .inner {padding:0 15px 15px 0; min-height:135px;} #primary {padding-top:15px;} #primary .inner {padding:0 !important; margin:0 !important;} #secondary, #tertiary, #secondary .inner, #tertiary .inner {padding:0 !important;} #footer {font-weight:bold; text-transform:capitalize; text-align:right;padding:15px 65px 20px 0;} #footer a {font-size:1.4em;} #title {font-size:2.05em; text-transform:capitalize; margin-right:360px; padding-top:20px; padding-left:70px;} #subtitle {font-size:1.4em; font-weight:normal; margin-right:380px; padding-left:70px; font-style:italic; } #pagetitle {font-size:1.4em; text-transform:uppercase; font-weight:normal; margin-right:380px; padding-top:10px; padding-bottom:0; padding-left:70px;} .entry-wrapper {margin:20px 15px 60px 15px; padding:0; min-height:210px;} .entry {margin:0; padding:0 15px 10px 15px;} h3.entry-title {font-size:1.5em; font-weight:bold; margin-right:190px; padding:20px 0px !important;} .entry-title {padding:10px 0 15px 0;} .entry .datetime {font-style:italic; clear:right;} .entry .poster {float:left; padding:4px 0 0 0 !important;} .entry .poster a {font-weight:bold; font-style:italic;} .entry .userpic {float:right; margin:0 0 10px 10px;} .entry-content {padding:22px 0 !important; clear:left;} .metadata ul {list-style-type:none; list-style-position:outside; padding:0 !important; margin:0 !important;} .metadata-label {font-weight:bold; text-transform:capitalize;} .tag-text {text-transform:capitalize; font-weight:bold;} .tag ul {display:inline; list-style:none; margin-left:0.5em; padding-left:0;} .tag ul li {display:inline; padding:0.25em;} .metadata, .tag {clear:left;} .navigation {font-weight:bold; text-align:center;} /* ---entry&comment links--- */ .entry-management-links, .comment-management-links {margin:0; text-align:right; clear:right;} .entry-management-links {padding:40px 0 2px 0;} .comment-management-links {padding:0 0 2px 0;} .entry-interaction-links, .comment-interaction-links {margin:0; padding:1px 0 6px 0; text-align:right; clear:right;} ul.entry-management-links, ul.entry-interaction-links, ul.comment-management-links, ul.comment-interaction-links {list-style:none; list-style-position:outside;} ul.entry-management-links li, ul.entry-interaction-links li, ul.comment-management-links li, ul.entry-interaction-links li {display:inline !important; padding:0 0.25em} /* ---modules--- */ .module-header {padding-left:35px; padding-top:8px !important; padding-bottom:3px !important; text-decoration:underline;} .module-wrapper, .module-section-one, .module-section-two {margin:0 !important; padding:0 !important;} .module-wrapper {padding-top:30px !important;} .module {margin:0 15px 20px 15px !important; padding:0 0 20px 0 !important;} .module-content {margin:0 5px; padding: 0; text-align:left;} .module-userprofile .module-content {text-align:center;} .module-userprofile .userpic {margin-top:10px; margin-bottom: 10px;} .journal-name, .journal-website-name {padding-top:5px; padding-bottom:5px;} ul.userlite-interaction-links {margin-bottom:0;} .module-navlinks ul {list-style-type:none; list-style-position:outside; margin:0; padding:0; text-align:center;} .module-calendar .module-content table {margin:0; padding:0; text-align:center; width:100%;} .module-calendar th, .module-calendar td {border:1px solid #fff;} .module-calendar td.entry-day {background:#fff;} .module-calendar .empty-day, .module-calendar .entry-day {margin:1px; padding:0 2px;} .module-calendar .empty-day, .module-calendar .entry-day, .module-calendar .entry-day a, .module-tags_list .module-content, .module-tags_cloud .module-content, .module-tags_multilevel .module-content, .module-pagesummary .module-content, .module-typelist .module-content {font-size:10.5px; font-family:verdana, tahoma, arial, sans-serif;} .module-pagesummary .module-content li {margin-bottom:12px;} .module-tags .manage-tags-link {padding-top:5px;} .module-tags_cloud .module-list {padding:0 0 15px 0 !important;} .module-syndicate .module-content {padding:10px 0 0 35px; margin:0; text-align:left;} .module-time {font-style:italic;} /* ---reply&comment--- */ #qrform table {margin: 20px 0 0 auto !important; border-width:0 !important; background-color:transparent; padding-bottom:30px !important;} #postform table.talkform {margin:0 auto; font-weight:bold;} #comments {margin-left:15px; margin-right:15px; margin-bottom:15px; padding:80px 15px 0 15px; } .comment-wrapper {padding:5px; margin-bottom:20px;} .comment-title {font-size:1.4em; font-weight:bold; margin: 0 0 10px 0 !important; padding-top:5px; text-decoration:underline;} .comment .datetime, .poster-ip {font-style:italic; font-size:10.5px; font-family:verdana, tahoma, arial, sans-serif;} .comment .poster, .comment .poster a {font-weight:bold;} .comment .userpic {float:right; margin:0 0 10px 10px;} .comment-content {padding:15px 0;} .multiform-checkbox {float:right; font-weight:bold; clear:right; padding-bottom:5px;} .bottomcomment .entry-interaction-links {padding-bottom:40px;} .bottomcomment {padding-top:20px; padding-bottom:20px; text-align:right; font-weight:bold; margin-left:-15px;} /* ---archive--- */ #archive-year, #archive-month {margin-left:15px; margin-right:15px; padding:30px 15px 0 0;} #archive-year .inner, #archive-month .inner {padding-left:15px !important; padding-bottom:75px !important;} #archive-year .navigation .inner, #archive-year .contents .inner, #archive-year .year .inner, #archive-year .footer .inner, #archive-month .navigation .inner, #archive-month .month .inner {padding:0 !important;} #archive-year ul {margin-right:175px; text-align:left;} #archive-year .header h3 {font-size:1.3em; margin-top:15px; margin-bottom:25px; padding-bottom:0;} table.month {border-width:2px; width:350px; font-weight:bold; font-size:1.0em;} table.month td.day {padding:10px; text-align:center; height:25px;} table.month caption {padding-bottom:10px;} #archive-year .footer .inner {font-size:1.0em; padding-top:15px !important; padding-bottom:30px !important; font-weight:bold;} .page-day h3 {padding-left:15px; font-size:1.5em;} .text_noentries {padding-left:15px;} #archive-month .navigation {padding-top:15px;} .page-month h3.entry-title {font-size:1.0em; margin-right:15px;} #archive-month dt {font-size:1.5em; margin-top:25px; padding-bottom:0; margin-bottom:10px; margin-right:15px;} #archive-month dt a {text-decoration:none;} #archive-month dd {margin-left:0; font-weight:bold;} /* ---tags--- */ .page-tags #primary .inner h2 {margin:15px 0 0 0; padding:45px 15px 15px 70px;} ul.ljtaglist {padding:10px 15px 30px 100px; background:#fff;} .page-tags .tags-container {margin:0 15px; padding-bottom:100px;} .page-tags #primary .inner .manage-tags-link {padding:10px 0 10px 70px; font-weight:bold;} /*---------------------------------*/ /*--Paste Color Scheme Code Below--*/ /*---------------------------------*/
9. Select 1 of the 3 Color Schemes below (green, pink, or lavender). Copy the code and paste into the "Use embedded CSS" box beneath the "Code".
Peaches & Green	DW Pink	Lavender Blossom
/* Color Scheme - Peaches and Green */ #lj_controlstrip {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/control_pg.png) top left repeat-x #317021;} div.ContextualPopup, div.ContextualPopup .Userpic {border:1px solid #317021;} .module-userprofile .userpic img {border:4px solid #317021;} .entry .userpic, .comment .userpic {border:4px solid #ff6347;} a, #footer a:hover, h3.entry-title, .module a:hover {color:#ff6347;} body, #header, a:hover, #footer a, .module-header, .module a {color:#317021;} #postform table.talkform b {color:#317021 !important;} body, #canvas, #primary, .module-wrapper, .module-section-one, .module-section-two, .module, .module-content {background:#bff684;} #header {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_header_pg.png) top right no-repeat #bff684;} #header .inner {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_headerin_pg.png) top right no-repeat #fff;} #title {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_title_pg.png) top left no-repeat transparent;} #footer {background:url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_footer_pg.png) top right no-repeat transparent;} .entry-wrapper, .bottomcomment, .page-tags .tags-container {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entrywrap_pg.png) bottom left no-repeat #fff;} #archive-year .inner, #archive-month .inner {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entrywrap_pg.png) bottom left no-repeat transparent;} .entry {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entry_pg.png) top right no-repeat transparent;} #comments, #archive-year, #archive-month, .page-tags #primary .inner h2 {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entry_pg.png) top right no-repeat #fff;} .module-header {background:url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_module_pg.png) top left no-repeat transparent;} .module {border-bottom:1px dashed #317021;} .comment-wrapper-odd {border-top:2px solid #ff6347; border-bottom:2px solid #ff6347; background:#fff5ee;} .comment-wrapper-even {border-top:2px solid #ffba39; border-bottom:2px solid #ffba39; background:#fffbd9;} #archive-year .navigation .inner, #archive-year .contents .inner, #archive-year .year .inner, #archive-year .footer .inner, #archive-month .navigation .inner, #archive-month .month .inner {background:none !important;} #archive-year .header h3 {border-bottom:2px solid #317021;} #archive-month dt {border-bottom:2px solid #ff6347;}	/* Color Scheme - DW Pink */ #lj_controlstrip {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/control_dwp.png) top left repeat-x #317021;} div.ContextualPopup, div.ContextualPopup .Userpic {border:1px solid #c1272d;} .module-userprofile .userpic img {border:4px solid #c1272d;} .entry .userpic, .comment .userpic {border:4px solid #f4717a;} body {color:#317021;} #header, a:hover, #footer a {color:#40942b;} #postform table.talkform, #postform table.talkform b {color:#40942b; !important} .module-header, .module, .module a {color:#c1272d;} a, #footer a:hover, h3.entry-title, .module a:hover {color:#f4717a;} body, #canvas, #primary, .module-wrapper, .module-section-one, .module-section-two, .module, .module-content {background:#ffd8d8;} #header {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_header_dwp.png) top right no-repeat #ffd8d8;} #header .inner {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_headerin_dwp.png) top right no-repeat #fff;} #title {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_title_dwp.png) top left no-repeat transparent;} #footer {background:url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_footer_dwp.png) top right no-repeat transparent;} .entry-wrapper, .bottomcomment, .page-tags .tags-container {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entrywrap_dwp.png) bottom left no-repeat #fff;} #archive-year .inner, #archive-month .inner {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entrywrap_dwp.png) bottom left no-repeat transparent;} .entry {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entry_dwp.png) top right no-repeat transparent;} #comments, #archive-year, #archive-month, .page-tags #primary .inner h2 {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entry_dwp.png) top right no-repeat #fff;} .module-header {background:url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_module_dwp.png) top left no-repeat transparent;} .module {border-bottom:1px dashed #c1272d;} .comment-wrapper-odd {border-top:2px solid #f4717a; border-bottom:2px solid #f4717a; background:#fff6f7;} .comment-wrapper-even {border-top:2px solid #40942b; border-bottom:2px solid #40942b; background:#f3fae8;} #archive-year .navigation .inner, #archive-year .contents .inner, #archive-year .year .inner, #archive-year .footer .inner, #archive-month .navigation .inner, #archive-month .month .inner {background:none !important;} #archive-year .header h3 {color:#40942b; border-bottom:2px solid #f4717a;} #archive-month dt {border-bottom:2px solid #f4717a;} .page-day h3 {color:#40942b;}	/* Color Scheme - Lavender Blossom */ #lj_controlstrip {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/control_lb.png) top left repeat-x #70387e;} div.ContextualPopup, div.ContextualPopup .Userpic {border:1px solid #70387e;} .module-userprofile .userpic img {border:4px solid #70387e;} .entry .userpic, .comment .userpic {border:4px solid #70387e;} a, #footer a:hover, h3.entry-title, .module a:hover {color:#40942b;} body, #header, #footer a, .module-header, .module, .module a, a:hover {color:#70387e;} #postform table.talkform b {color:#70387e !important;} body, #canvas, #primary, .module-wrapper, .module-section-one, .module-section-two, .module, .module-content {background:#c1b1d7;} #header {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_header_lb.png) top right no-repeat #c1b1d7;} #header .inner {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_headerin_lb.png) top right no-repeat #fff;} #title {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_title_lb.png) top left no-repeat transparent;} #footer {background:url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_footer_lb.png) top right no-repeat transparent;} .entry-wrapper, .bottomcomment, .page-tags .tags-container {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entrywrap_lb.png) bottom left no-repeat #fff;} #archive-year .inner, #archive-month .inner {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entrywrap_lb.png) bottom left no-repeat transparent;} .entry {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entry_lb.png) top right no-repeat transparent;} #comments, #archive-year, #archive-month, .page-tags #primary .inner h2 {background: url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_entry_lb.png) top right no-repeat #fff;} .module-header {background:url(http://i15.photobucket.com/albums/a374/Stellastars/Layouts/Fleur/fleur_module_lb.png) top left no-repeat transparent;} .module {border-bottom:1px dashed #70387e;} .comment-wrapper-odd {border-top:2px solid #70387e; border-bottom:2px solid #70387e; background:#f0e6f7;} .comment-wrapper-even {border-top:2px solid #40942b; border-bottom:2px solid #40942b; background:#eaf4e7;} #archive-year .navigation .inner, #archive-year .contents .inner, #archive-year .year .inner, #archive-year .footer .inner, #archive-month .navigation .inner, #archive-month .month .inner {background:none !important;} #archive-year .header h3 {border-bottom:2px solid #70387e;} #archive-month dt {border-bottom:2px solid #40942b;}
10. Click "Save Changes."

Please consider uploading the images to your own host. Images marked (x2) are used twice in the code.

Peaches & Green control header headerin title footer entrywrap (x2) entry (x2) module

DW Pink control header headerin title footer entrywrap (x2) entry (x2) module

Lavender Blossom control header headerin title footer entrywrap (x2) entry (x2) module

Comments

[orchidfire]

This is cute! :)

[orchidfire]

Also, yay for testing it on Ubuntu! Though if you want to have total browser compatibility, I have a friend who complains a lot about things not working in Opera.

[lyras]

These are so very pretty! I think I'm going to give the lavender one a try when I have some free time. Thank you!

[stellastars]

You're very welcome! Glad you enjoyed them!

[ferne]

These are gorgeous. I just changed my layout, but I'll definitely keep these in mind for later!

[stellastars]

Thank you very much for the lovely comment! :-)

[breakupsong]

not using,maybe in the future. but it's really cute :)

[stellastars]

Thank you! Glad you liked it!

[helens78]

Wow, these are gorgeous! :)

[stellastars]

Thank you very much! :-)

[baggyeyes]

Cool.

[stellastars]

Thanks! :)

[diner]

Very pretty!! Will add to memories. :D

[stellastars]

Thank you very much! I'm glad you liked the layout!

[wilhelminabenedict]

These are gorgeous! Thank you so much for sharing~

[stellastars]

Happy to share! Thank you for the lovely comment!

[kitrona]

Hey, check it out, if I don't skip any steps it works! *headdesk at self*

Thanks for the beautiful layouts! :)

[stellastars]

:-) Glad to hear that you were able to get it working and very glad to hear that you liked it!

[alittlebirdy]

That is so pretty!

I seem to be having problems with it though. For some reason the sidebars are appearing at the bottom of the layout. I thought it might just be because I am using Opera as my browser but I checked in Firefox too, and it is doing the same thing. I've made sure I chose the right setup - I tried both 2 and 3 column with sidebar on right. I tried resizing my browser too but no luck. Do you know what might be wrong?

[alittlebirdy]

oops never mind. I forgot to check the "Use layout's stylesheet(s)" box.

[afuna]

Wow, these are gorgeous. I... I can't choose!

[stellastars]

*g* Thank you for the lovely comment!

[meesh]

ooh that's really pretty!

I may try it out - as much as I love the one I currently have it doesn't fill the page, so I might try this one instead :)

[stellastars]

Thank you!

This is actually the first flexible width layout I've made to share, so I'm glad to hear users are finding it useful!

:-)

[inkstone]

These are so cute! Currently using the lavendar one. :)

[stellastars]

Thank you very much! I'm glad to hear you liked it!

[elizaria]

Oh - these are very pretty :D

None of the colors really win it for me to use now, but I love the style on it. So I may come back to use it later with changing colors if that's ok?

[stellastars]

Thank you for commenting!

I know the colors were a little unusual and not necessarily to everyone's taste. I don't mind at all if you alter the colors, just please credit me as the designer!

:-)

[nerakrose]

i used the lavender one, thank you :)

[stellastars]

Glad to hear you liked it! Thank you!

[carisma_sensei]

That's one of the best layouts i have seen so far, it's really pretty on all its variants!

But i tested it on IE7 with your live preview and the sidebar that contains the profile and stuff, doesn't show.

I have had compatibility problems with IE on tabula rasa too uhh. I guess it's better to keep updating IE :3

[stellastars]

Thank you very much for such a lovely comment!


And thank you for mentioning that you gave it a try in IE7. I had hoped to get it working in IE7 (since I'm guessing so many people are still using it) but after some general compatibility issues with Tabula Rasa in that browser, I decided not to fiddle with it more.

[ilthit]

Beautiful! Especially love the green version.

[stellastars]

Thank you very much! The green one is my personal favorite of the three! ;-)

[laerwen]

This is incredibly cute, omg. Using the lavender scheme now!

[stellastars]

Thank you! And speaking of cute -- your icon! I love it!

[dee_groovy]

oooo, I love these! :D

now which one? hmmmm.....

[stellastars]

hee, Choices, choices... :D

Glad to hear you liked them!

[kalli]

Pretty. :)

[stellastars]

Thank you! :-)

[snowpuppies]

Nice!

[stellastars]

Thank you very much!

[hillarygayle]

These. Are. So. Cute.

I'm really thinking about rocking the green one for spring.

[stellastars]

Thank you very much! :D

Spring was exactly what I was thinking about when I made the green one, so I'm pleased to hear that idea came through!

[bankai]

Oh God, these are so pretty!

[stellastars]

:D Thank you very much!

[melissagrey]

Layouts are love. Using the yellow one. Will credit. Thanks!

[stellastars]

Thank you for commenting and crediting! I'm glad to hear you liked them!

[theantijoss]

Although really not my style, I love it so much that I'm SAD it's not my style.

That's... meant to be a compliment. :D Lovely work!

[stellastars]

That's a very lovely compliment! Thank you for commenting!