HOME | DD

Published: 2006-11-05 20:55:55 +0000 UTC; Views: 75277; Favourites: 1750; Downloads: 373
Redirect to original
Description
EDIT Jan 2014: This way to code, while still valid to a degree, is rather outdated.You can find an updated guide here:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Part 1 of 2 - the corresponding template can be found here www.deviantart.com/deviation/4…
This tutorial deals with the process of designing a CSS journal and of how to get the thing coded.
It only covers the basics, custom divs will be dealt with in Part 2 - which can be found here .
If you have no idea what CSS is, I suggest you read up on the basics before tackling this tutorial.
In here, I just assume you know what a div is...
Also try these links:
thespook is compiling a CSS guide (I'll link it here when it's finished), he also has a nifty Journal structur reference in his gallery.
If you speak German (or French), you can try selfHTML.org - it's not only great for learning HTML, CSS, Javascript,... but also offers quick references on the code you can use.
The quote I used from zilla774 is taken from his news article Journal CSS Resources which also has some more links to things you might find useful.
And last but not least, the link to the Lorem Ipsum Generator which also explains where that text comes from.
Related content
Comments: 257
ExiledChaos In reply to ??? [2007-12-03 22:04:38 +0000 UTC]
wow!! O__O Excellent work! This made it really easy to understand. Thanks for making such a great tutorial
👍: 0 ⏩: 1
Chukkz In reply to ??? [2007-12-03 16:02:09 +0000 UTC]
This is very valuable stuff, thanks a lot! ^^
👍: 0 ⏩: 0
Meeliah In reply to ??? [2007-11-30 17:36:10 +0000 UTC]
I used your tutorial for my journal.
Thanks.
👍: 0 ⏩: 0
WinterSeason In reply to ??? [2007-11-13 23:35:07 +0000 UTC]
Wonderful tutorial!
Now, CSS for journals totally makes sense.
I'll try it out sometime!
👍: 0 ⏩: 1
kuschelirmel-stock In reply to WinterSeason [2007-11-14 10:31:26 +0000 UTC]
glad to hear it helped!
👍: 0 ⏩: 0
Kelzky [2007-11-08 23:11:41 +0000 UTC]
Wow this has been a great help as I was looking at CSS books and thinking hmm... lol I've just completed doing this part and got my basic journal up
I'm going to start part two now to make it look fancier... probably be up til two in the morning doing it!
👍: 0 ⏩: 1
kuschelirmel-stock In reply to Kelzky [2007-11-09 16:15:14 +0000 UTC]
glad to hear it's helpful
👍: 0 ⏩: 0
minami63 In reply to ??? [2007-10-27 09:46:58 +0000 UTC]
Well, it's not very fancy, but I have a new journal CSS thanks to your tutorials! Fantastic! Thanks so much for doing these!
👍: 0 ⏩: 1
ardunt In reply to ??? [2007-10-26 15:34:27 +0000 UTC]
gifted me a subby and between the two of you I have started using CSS. Thanks for the very in depth tutorial.
👍: 0 ⏩: 1
Mystik-Rider In reply to ??? [2007-10-12 20:23:34 +0000 UTC]
thank you for those great turorials no 1 & 2! There be usuful ..
👍: 0 ⏩: 1
kuschelirmel-stock In reply to Mystik-Rider [2007-10-13 11:01:48 +0000 UTC]
you're most welcome
👍: 0 ⏩: 0
fairyDany In reply to ??? [2007-10-11 02:42:30 +0000 UTC]
I understood I must put the images online.
Can be in [link] (ImageHosting) and if it is, what code I put on my journal?
I didn't get this part very well...x)
👍: 0 ⏩: 1
kuschelirmel-stock In reply to fairyDany [2007-10-11 10:27:27 +0000 UTC]
after uploading, it should give you an url (starting with http:// ... ) that is what you need to use.
👍: 0 ⏩: 0
Elitha In reply to ??? [2007-10-08 00:40:59 +0000 UTC]
I have a question: how can I assign a footer image at the bottom and keep the moods at the top?
Thanks so much in advance
👍: 0 ⏩: 1
kuschelirmel-stock In reply to Elitha [2007-10-08 10:25:17 +0000 UTC]
you need to find another div that goes all the way down, my first choice would be .journalbox if you assign an image there with:
background: url(url) no-repeat bottom left/right/center;
you will be able to put an image at the bottom while being able to move the moods around
hope this helps!
👍: 0 ⏩: 1
Elitha In reply to kuschelirmel-stock [2007-10-08 21:18:40 +0000 UTC]
Thank you so much!! I'm such a newbie when it comes to codes
👍: 0 ⏩: 0
SkyAndNatureClub In reply to ??? [2007-09-22 03:13:53 +0000 UTC]
nice one , usufel
but i need the codes please , because whenever i edit my journal , the header doesnt show
👍: 0 ⏩: 1
kuschelirmel-stock In reply to SkyAndNatureClub [2007-09-23 10:43:46 +0000 UTC]
download the scorpion css - thats the code for this, just like it says in the artists comment
👍: 0 ⏩: 1
HBO-Pixellated In reply to ??? [2007-09-19 17:26:22 +0000 UTC]
Thanks very much, this has helped me a lot with my new journal ^^
👍: 0 ⏩: 0
Mehrunnisa [2007-09-14 21:03:27 +0000 UTC]
Thank you so much for this, this is an excellent piece of knowledge and I am showing it to everyone since I am helding a CSS Contest
👍: 0 ⏩: 1
kuschelirmel-stock In reply to Mehrunnisa [2007-09-23 10:46:35 +0000 UTC]
uuuuh - too bad I'm a bit pressed for time or I just might enter
thanks for the publicity
👍: 0 ⏩: 1
Mehrunnisa In reply to kuschelirmel-stock [2007-09-25 17:45:37 +0000 UTC]
I have just extended the dealine
👍: 0 ⏩: 1
7ngwe-ngwe-ngwe7 In reply to ??? [2007-09-13 00:39:28 +0000 UTC]
I'm new to this....everything's fyn except for the header image...it's olways cut off....and i dont know y...help please?
👍: 0 ⏩: 0
Midnightrainne In reply to ??? [2007-09-01 00:29:20 +0000 UTC]
Hey, great tutorial, I'm a total beginner and this one really has helped me. I tried many different tutorials but this is the only one that really helped. Thanks!
👍: 0 ⏩: 1
kuschelirmel-stock In reply to Midnightrainne [2007-09-01 15:58:37 +0000 UTC]
glad it helped
👍: 0 ⏩: 0
snowplox In reply to ??? [2007-08-26 20:21:54 +0000 UTC]
Amazing! This really helped me make my CSS Journal! Have a look at it here [link] I customized the graphics but the layout etc is all the same
👍: 0 ⏩: 1
kuschelirmel-stock In reply to snowplox [2007-08-26 22:13:14 +0000 UTC]
glad i could help
nice layout, too
👍: 0 ⏩: 1
snowplox In reply to kuschelirmel-stock [2007-08-26 22:19:53 +0000 UTC]
thanks i am sort of getting the hang of customising with CSS i am a real begginer so its a little hard
👍: 0 ⏩: 0
arhcamt In reply to ??? [2007-08-17 03:25:04 +0000 UTC]
thanks a lot for sharing! one step closer to making my own css layout.
👍: 0 ⏩: 1
Death-By-Romance In reply to ??? [2007-08-15 00:36:48 +0000 UTC]
Ah! Thank you very much for your help! This is helping me learn what all the scripting means and helping me become more independent! Thank you very much. I'm am quite pleased with the outcome. Maybe I will look more into the Part 2 later!
👍: 0 ⏩: 0
WineWriter [2007-08-14 19:49:56 +0000 UTC]
This is very useful! I've learned a lot from this as a begginer.
👍: 0 ⏩: 0
Sabtastic In reply to ??? [2007-08-10 21:09:54 +0000 UTC]
Question! :c
lol I'm a brand new subscriber, and I've never used 'CSS' before, ---so is it a program I have to OWN in order to make my own fancy journals, or is it just a bunch of codes that I have to copy-paste into my journal....?? o_o
👍: 0 ⏩: 1
kuschelirmel-stock In reply to Sabtastic [2007-08-12 11:14:49 +0000 UTC]
its code. if you actually read the tutorial you'll understand
👍: 0 ⏩: 0
calgarc [2007-08-05 01:35:06 +0000 UTC]
woohoo i already now some css but i cant get it working on my journal this will definitely help
👍: 0 ⏩: 1
elephantina [2007-06-30 05:57:18 +0000 UTC]
Thank you for your time and effort on making this.
👍: 0 ⏩: 1
kuschelirmel-stock In reply to elephantina [2007-06-30 10:50:28 +0000 UTC]
you're most welcome
👍: 0 ⏩: 0
ILICarrieDoll [2007-06-16 11:45:27 +0000 UTC]
This is great! Thanks a lot for the 2 parts tutorials
👍: 0 ⏩: 0
Rnld In reply to ??? [2007-06-08 12:02:27 +0000 UTC]
Thank you so much, I will use this great tutorial as a basis to start building my own
You really helped me out a lot ^^
👍: 0 ⏩: 1
kittiesgomah In reply to ??? [2007-06-02 19:24:02 +0000 UTC]
Your tutorial helped me out alot. I am going to feature these in my journal to credit you.
👍: 0 ⏩: 1
<= Prev | | Next =>