HOME | DD

ClaireJonesSimple + Clean v1.2 CSS Layout by-nc

Published: 2007-03-16 20:13:09 +0000 UTC; Views: 137261; Favourites: 1785; Downloads: 12400
Redirect to original
Description User Level: Beginner to Intermediate
Compatibility: Should work in both Firefox and IE.

View the live version here: [link]

Warning! This layout is currently being edited to fix some problems caused by the new dA userpages.

I've seen a lot of CSS layouts here on dA, some good and others not so good, but I haven't seen a lot of utterly simplistic dA colorscheme layouts. That's where I come in. It's not the best design out there, but it was what I had wanted for my own journal.

Be sure to go over the readme before attempting to apply the CSS to a journal.

Thanks so much for all the usage and ! I really appreciate it. I never thought Simple + Clean would be so popular.

Features:
  • Minimalist design to compliment the dA layout
  • Scroll box to contain images (if desired)
  • Right-hand Links sidebar
  • Two main header styles
  • An additional smaller header that can be used more or less like a caption
  • Only one graphical element (could be good or bad, depending on one's preference)
  • Many of the elements are moderately easy to customize (link colors, etc.)

Mood Box:
Make the Mood Box visible by removing "display: none;" from .list { }. The new code allows it to be placed either at the top or bottom of the journal. Nothing fancy here, but at least it's not all fugly like before.

Columns:
Be sure to have more content in the main (left) column. Otherwise, the links will spill into the sections below. This was fixed in later Simple + Clean versions by using a different CSS method.

More CSS Layouts: [link]

Change Log:
8-26-07:
Argh. I think dA didn't recognize the new ZIP file I uploaded (not the first time the phenomenon has occurred). Should be the correct version now.

8-24-07:
  • Removed "Journal Entry" text leaving date still visible.
  • Fixed code so that the "Journal Entry" text will not display in IE (displays as 1px text).
  • Added correct Mood Box code so that it will not be visible by default.
  • Fixed Mood Box code so that it displays correctly when visible.
  • The new headers are now .header1 (old header), .header2 (same as .header1, but in small-caps) and .header3 (centered small text header with expanded font).
  • Scooted the "No Comments/Prev. Journal" links over to align with the rest of the journal layout.

5-26-07:
After some careful consideration on the Creative Commons License, I have removed the Share Alike attribution. I think the general Non-Commercial license works best for everyone.

Origin:
Simple + Clean's name originates from Kingdom Heart's main theme, Simple and Clean (the English version of Hikari) by Utada Hikaru.

dA members who have used this CSS:
~1ofthefew | ~870 | ~Adaae | ~allsoulsnight | *angelsashes | =Anoya | =Anupthra | *Ashley425 | *AStarAboveU | =babylon6 | ~BluefootedCrow | `budgie | =cameraoscura | =CandyStriped | *CB-Stock | =charlie140588 | =Chicken-monster | *cloudliqueur | =createbyweek | ~CursedBlackwings | ~DA-Freja | =damouse | *dana-martinez | ~dbl-A | =Digital-Kisses | ~Dreamer-lupe | ~engelszorn | =ersi | ~Fabulae | *faestock | ~fanficbug | ~Fenetre-sur-Cour | ~FeverantObsession | ~flamingarrow | ~flightless-angel | *flowers-are-forever | =fluffyvolkswagen | ~ForeignSin | =forevergeek | `GeorgeHarrison | ~gigiptex | ~gold-chocobo | =Green-najotake | =GreenBushido | ~hagarun | ~hannaelly | =Hantenshi | ~hartofgold | =helly7307-stock | ~hengie | ~imbecile-anthem | ~imxanxillusion | ~inkshed | ~jessandpencil | =Jezhawk | ~Katherine--Elizabeth | ~kazugfx | =khimaereus | *KirlianCamera | ~KittyKittyMeow | =KoolGal14 | =Kycha | =LadyAmdis | ~Lilyse | ~loki-mcdamage | =lone-momo | ~lowapproach | =Lucky101 | ~LuPY | `lyastri | ~maf8 | *markskywalker | *Mazoku85 | ~mcboyde | ~Minolta | ~missbecca | *MissKeira | `mom-the-bomb | =MsRebelDoll | ~mwirsig | ~MysteryRealm | ~nativa | ~NijiHana | ~Nilala | ~oniNON | ~onpaperwings | `parliamentFunk | ~pencil-ninja | `pendlestock | ~PekGuo | ~Phoenix13x5 | ~pr0jectz | ~RainDropSoup | ~RaquelCree | =Rebecca-Parker | ~redbuffalo2001 | ~redhead-2008 | =robinism | =Ronnen | ~sakura0104 | ~sandemonic | ~Sarto-San | =sayra | =Saysamia | ~scarabee | ~seorangprempuan | ~sergiofx | =ShadeGlass | `SheTakesPics | ~Shia-Izumono | *Sklarvv | ~SleepySh | *slumberdoll | =snapr | *soheir | *SojiOkage | ~Sokyu | ^StJoan | =stormyblueyz | ~SubwoofaCS | ~summersilhouette | ~tangledseaweed | ~technosplat | ~THFM | ~the-ace-chef | =TheOnlyLordRequiem | =tragic-saturn | *Transcripts | =TrixyPixie | ~Tiuni | ~VenomMistress | ~victoriastar | ~WiccaJaz | =wildheartfreesoul | ~wpe2006 | =xldstudios | ~Xx-Black-Soul-xX | =xxchange | ~fullmetalkittn | ~Yokou-chan | *zombiemeena

Edited Versions:
~afiqqq | =alucinogenos | ~arciel | *ArtistUnwanted | *asteroid--blues | ~Aukon | ~biting-bullets | =BlindWorld | =BlueStef | ~Canides | ~cbsmoonlight | ~chesterblover | =ChiChiRoma | *christel-b | =Cristian-M | *cocacolagirlie | =cougars | =CrazyLadiee | ~crirox | *cyKoe | ~davesteele | ~DeadlyDonna | ~dELOdePote | =Docali | ~DraggyGirl | =DuckTape-Productions | ~eeron | =elithespork | ~ethereal-dreams | =Fixedys | ~fizster | =Freakshow6 | ~fullmetalkittn | =Furiousxr | =greymoccasin | *Hedfones | ~henica | ~Hinderence | *hortensie | ~i-be-c | ~ilona | *ILTBY | !imaboneheadtoo | ~itsMoochan | ~jaderose43 | *jakikukeko | =joannastar-stock | =jocarra | `juuhanna | =Karbo | =Kherrigan | =known-secret | =Kuru-da-Bunbun | *ladysage1999 | *lavabeast | *LazyMary | =leeroi1 | *leAlmighty | =lil-twilight-wolf | =Lillymon | =Lune-Tutorials | ~lutrasilvereye | =M-PlayC3ll | *magnublaze | =MaureenOlder | =MissyStock | =Mithgariel-stock | ~mulduan | ~nadiard | ~Naruto-Couples-fc | ~neonfishy | =NightsongWS | =nintendo-goddess | ~Noushie | =onixa | =OnPix-artist | ~paintingwords | =pen-mage | *pencilenvy | ~perilous-dreamer | =PhoenixKnght86 | ~philosophyoftime | ~Polinadiab | `Princess-of-Shadows | *PrisonerofConvention | =ProSI | ~purplesunfire01 | =quiet-krys | ~rafemccawley | =rheall | =ribcage-menagerie | =robinism | *Ryushay | =SeaMist | =Seventh-Seal | =sfpup | =Shaelynn | ~ShayLee | ~SkyesFantasyStock | ~Somnilocus | ~starflower135 | *strangelight | =super-fly-rules | =sweetfire-05 | =thali-n | =TheDEviLDweLLeR | ~thenamelessone | =TwilightMoon | ~Unpleasable | ~Vamediah | =veryangelic | ~vickygraphy | ~Waltz-With-Me | *WhiteGaby | :devWofkaJ: | =xSYNNcere | *XxCrimsonFuryxX | ~Ze6 | *ZeppTokyoASK | =Zhampip


Edit:
Wow! A DD? I'm so surprised and honoured. Thanks so much to =robinism for the suggestion and `maxwell-heza for the feature!
Related content
Comments: 852

Sanguaze [2013-12-03 04:10:21 +0000 UTC]

thank's for the functional and simple journal, i'm using it here sanguaze.deviantart.com/

👍: 0 ⏩: 0

JustAnotherUser13 [2013-09-12 18:30:01 +0000 UTC]

My God... THE SPAM
Btw, will it work on Chrome?

👍: 0 ⏩: 0

sesquipedaliophobiac [2013-08-07 04:04:16 +0000 UTC]

I used your design, but changed the colors around.

👍: 0 ⏩: 0

daristotle [2013-07-10 06:48:12 +0000 UTC]

I didnt think there was a way out this really intrigued me I am headed right for the top no pressure just check it out
[link]

👍: 0 ⏩: 0

arc4nis [2013-07-10 02:29:40 +0000 UTC]

I had finally hit rock bottom this turned my luck around its an amazing feeling to have money to blow just picture the possibilities
[link]

👍: 0 ⏩: 0

AlbieReo [2013-05-08 20:51:28 +0000 UTC]

Hello I just wanna tell you that I used your journal CSS, of course I respect the copyright ^^ Thank you so much to share this CSS ♥

👍: 0 ⏩: 0

Rising-High-Ranch [2012-12-29 18:24:41 +0000 UTC]

How could we add an image to the top?

👍: 0 ⏩: 0

samoholic [2012-09-19 18:00:56 +0000 UTC]

Beautiful and clean, great job!

👍: 0 ⏩: 0

Vooron [2012-07-12 11:25:29 +0000 UTC]

This looks cool. I may use it :3

👍: 0 ⏩: 0

Loki-Liesmith [2012-04-09 18:51:50 +0000 UTC]

Using it at the moment - thank you so much for the aesthetic, simple design.

👍: 0 ⏩: 0

CluelesssEvil [2011-11-08 22:54:07 +0000 UTC]

Nice, simple, and functional. I.m going to use a personalized edited version, if that's alright

👍: 0 ⏩: 0

Taivas-games [2011-10-17 06:46:44 +0000 UTC]

I used your css for my journal just letting you know thanx a bunch! for this useful resouce!

👍: 0 ⏩: 0

BeachBumDunkin [2011-07-20 23:45:22 +0000 UTC]

This is nice , I like the simplicity of it C: I'm think about using it C:

👍: 0 ⏩: 0

paradigm-shifting [2011-05-28 18:44:39 +0000 UTC]

Unfortunately, there does not seem to be any options for actually being able to use this skin. The ZIP file does not download and this does not seem to be an "installable skin". So sadly, as much as I would have enjoyed messing around with this -- there is no way to actually get at it. lol

Unless the option is hidden someplace, somehow ... or the ZIP file download actually does work and the reason its not working for me is the 8th wonder of the world ... well, i dunno. Its very strange. lol

👍: 0 ⏩: 0

magur [2011-02-17 11:27:22 +0000 UTC]

What a wonderful design! Thank you for sharing! I will definetly use it!

👍: 0 ⏩: 0

Reisen [2011-02-09 14:38:26 +0000 UTC]

Wow I so need to use this! D: So clean and simple, no strong colours and distractions

👍: 0 ⏩: 0

News-Goose [2011-02-04 08:59:31 +0000 UTC]

Elegant and simple! I love it, can't wait to use it

👍: 0 ⏩: 0

cookie-cutter [2011-01-10 12:18:55 +0000 UTC]

hey
I just wanna let you know that I'm going to use this css layout^^

👍: 0 ⏩: 0

amsfod [2010-12-26 22:44:23 +0000 UTC]

Using it. It looks lovely. :]

👍: 0 ⏩: 0

rispaizy [2010-11-30 03:58:11 +0000 UTC]

I like this one sooo much, i'm a fan of simplistic looking stuff and im going to use this ^_^

great job!

👍: 0 ⏩: 0

MarieAndersson [2010-11-24 15:42:59 +0000 UTC]

How do I get my things under the journal like moods, listening too etc, it's gone when I use this journal

👍: 0 ⏩: 1

cookie-cutter In reply to MarieAndersson [2011-01-10 12:18:47 +0000 UTC]

hey^^
It's written in the artists comment^^
"Mood Box:
Make the Mood Box visible by removing "display: none;" from .list { }. The new code allows it to be placed either at the top or bottom of the journal. Nothing fancy here, but at least it's not all fugly like before."
hope, this answers your question

👍: 0 ⏩: 0

LadyLunia [2010-11-07 18:29:21 +0000 UTC]

used.

👍: 0 ⏩: 0

Neitzarr [2010-09-22 01:21:30 +0000 UTC]

Awesome work~ Love it.

👍: 0 ⏩: 0

Octorin [2010-09-11 21:21:46 +0000 UTC]

Thanx for making this CSS, I found it rather easy to use and to edit. ^__^ And it's got a very nice layout.

👍: 0 ⏩: 0

r-assumpcao [2010-09-02 00:55:10 +0000 UTC]

I was looking for a layout, and I had no doubts when I saw this. I just have to learn how to use it, it's my first time adapting my journal. ^^

👍: 0 ⏩: 0

Ever-Lasting-Spirit [2010-08-16 19:16:06 +0000 UTC]

I am so going to use this! I hope you don't mind

👍: 0 ⏩: 0

Moonfullite [2010-06-27 08:17:47 +0000 UTC]

This Journal is so elegant I love it!

👍: 0 ⏩: 0

GlazeIce [2010-06-24 08:12:01 +0000 UTC]

I can't use it! Help, please.

👍: 0 ⏩: 0

TheInversion [2010-05-31 07:36:46 +0000 UTC]

Heya, just would like to say how amazing this is. I'm new with css, so I was wondering, where abouts do I put this code?

👍: 0 ⏩: 0

Pixelmari [2010-05-26 17:30:47 +0000 UTC]

hi what is your code for the Scrollbar area? I have it but I am stuck with the horizontal scroll bar

Do you know any code to remove it

BTW

overflow-x
dose not work

👍: 0 ⏩: 0

StarlightSovereign [2010-05-20 20:12:27 +0000 UTC]

Oh well I figured it out. Some of the terms have changed since the instructions were written I guess. Great skin thanks!

👍: 0 ⏩: 0

StarlightSovereign [2010-05-20 05:53:40 +0000 UTC]

I totally can't figure out how to use this...

👍: 0 ⏩: 0

mirandaskye [2010-05-17 14:15:13 +0000 UTC]

Very nice, thank you - exactly what I was looking for

👍: 0 ⏩: 0

UnheardSounds [2010-05-13 12:35:33 +0000 UTC]

wow, i like how its very clean, and simple.
:3 may i use please?(:

👍: 0 ⏩: 0

PinkPussyKat [2010-05-02 01:37:36 +0000 UTC]

This is so simple! It's perfect!
I think I might use it

👍: 0 ⏩: 0

Katha88 [2010-04-22 20:01:44 +0000 UTC]

I'm going to use it, edit it a bit :] Thank you for making such a neat css

👍: 0 ⏩: 0

numberxxvii [2010-04-20 13:53:19 +0000 UTC]

love it! I will def be using this

👍: 0 ⏩: 0

foocha-kyo [2010-04-05 20:47:30 +0000 UTC]

This is wonderful, thank you so much

👍: 0 ⏩: 0

ParamoreBitchx [2010-03-29 22:27:57 +0000 UTC]

I'd love to use it, thank you

👍: 0 ⏩: 0

laura-foo [2010-03-07 18:08:00 +0000 UTC]

There's no Install to Journal button....

👍: 0 ⏩: 0

Soundwave-1 [2010-03-03 02:15:20 +0000 UTC]

I love using this, it's so neat and keeps everything in order.

👍: 0 ⏩: 0

UzumakiRamen [2010-03-02 22:15:42 +0000 UTC]

I'm using this for my commission listings, [link] , and will be using it again for normal journal entries once I make a new entry. ^^

Thank you so much for making this!!

👍: 0 ⏩: 0

AngelLale87 [2010-02-22 21:29:39 +0000 UTC]

*_* I'm using it

👍: 0 ⏩: 0

Orantmihi [2010-02-21 10:59:13 +0000 UTC]

Oh! This is very stylish I'm going to try and use it -as the n00b I am- Thank you for sharing

You can add me to the list.

👍: 0 ⏩: 0

Yuki-Photo [2010-01-31 13:15:23 +0000 UTC]

Im using this one here: [link]

👍: 0 ⏩: 0

Pilgrin [2010-01-28 19:11:00 +0000 UTC]

This is very pretty. I think I might use it

👍: 0 ⏩: 0

EvilApple513 [2010-01-24 18:10:31 +0000 UTC]

I've started using this css and absolutely LOVE it! I never really liked using journal CSS because they never seem to fit with the rest of the DA style but this really looks like part and by of it and by far the BEST I've seen! Thank you for creating this!

👍: 0 ⏩: 0

arcticwings [2010-01-24 03:14:50 +0000 UTC]

It worked for me on Safari. <3

👍: 0 ⏩: 0

KoolKitty25 [2010-01-09 22:23:54 +0000 UTC]

It looks lovely.

I'm new to CSS, so I'm just wondering how to get the code for it so I can put it on my journal.

👍: 0 ⏩: 0


| Next =>