RebREBreb ([info]aucune_gloire) wrote,
@ 2005-01-08 22:55:00
Previous Entry  Add to memories!  Tell a Friend!  Next Entry
Current mood: bored

Translating Standard (f.a.) Code Tutorial
Alright, here I'll be just translating what the free account codes stand for. I noticed that a lot of people code blindly, not really knowing what the terms mean. So here I show you the standard free account code, by that I mean background + entries and what everything means. I suggest you be somewhat adverse in what they look like and their corresponding LJ overrides, etc.

Legend of Colors:
Any HTML will be in red
CSS will be in blue
overrides will happily be in gray.

Our Code:
GLOBAL_HEAD<=
<style type="text/css">
<!--

p,font,td {
font-family:arial;
font-size:8pt;
color:#000000;}


/*If you know HTML, you can often reference the elements with the CSS terms as often they're taken to be the same. By grouping several CSS terms together you can give them all the same property without having to repeat the same thing over and over for every group. Back to the point in that little group above you're telling the code to make the font 8pt arial in black for all the <p>, <font>, and all your td's. Make sure that when you group terms together that they do not conflict with one another. CSS read from the bottom up. So any conflicting properties and your browser will take the bottom most. This also goes for any classes or id's that would contain the same propeties, etc. XD you get the point */

body {
background-color:#96A4A4;
background-image:url('http://img.photobucket.com/albums/v21/ljlayouts/Orders/poetry.gif');
background-repeat:repeat;
scrollbar-base-color:#BFC5C7;
scrollbar-arrow-color:#BFC5C7;
scrollbar-track-color:#96A4A4;}


/*Okay, you're telling your browser now the the >body< portion will have a #96A4A4 background color along with 'http://img.photobucket.com/albums/v21/ljlayouts/Orders/poetry.gif'as our background. We also tell it to repeat on all x and y axis. I got a bit lazy on the scrollbar colors (remember they all work in IE, but what the heck) If you choose scrollbar-base-color, windows will automatically pick the remaining colors to give it its 3D look unless you specify the other properties like I have. So windows will not choose the default for the track and the arrow. */

table {
width:40%;
margin-right:25%
margin-left:25%;
border:1px solid black;}

table table {
margin:0px;
border:0px;
width:100%;}

table table table {
margin:0px;
border:0px;
width:auto;}


/* Here's where the CSS goes up a notch. First we start off with a standard table code. Give the width to be 40% of the screen and 25% margin on both sides and a happy little border. When you choose percentages as your units, remember that it adjusts with each screen resolution so becareful is you have a fixed position all planned out on your 1024x768, because it'd probably look like shit on 800x600. I would suggest using pixels or em (the width of the letter m) or ez (width of the letter z), something fixed. Right, now moving on past the basics. We have table table which means that this CSS only applies to HTML coding with 2 tables in sucession... and the saem goes with table table table.... Ya? Got it? */

a:hover {
color:#606060;
text-decoration:none;}

a:link,a:visited,a:active {
color:#404040;
text-decoration:none;
text-transform:uppercase;
font-weight:bold;
font-size:7pt;
font-family:verdana;}


/* And lastly, our links. IE standardizes links with an underline so we set text-decoration:none; so that it disappears and never returns unless of course you didn't say no text-decoration in your other link properties... The color,font, and weight were also changed accordingly. Now you could instead of writing all that choose this alternative link coding:

a {
color:#404040;
text-decoration:none;
font-weight:bold;
font-size:7pt;
font-family:verdana;}

a:hover {
color:#606060;
text-decoration:none;}

By setting a { we include all properties of the links and afterwards only write what will change once hovered in the subproperty... yaaaaa? XD */

-->
</STYLE>

<=GLOBAL_HEAD


And this concludes this short presentation of CSS. Clarifications that need to be done? It's very late at night. So I don't know what got carried away XD. I wanted to go more in depth and babble on some more about CSS but that would've been overdoing it.




(Post a new comment)


[info]cloneddementia
2005-01-11 01:54 am UTC (link)
Is this cause of me :)
*feels all warm inside*

(Reply to this)


[info]underthebridge0
2005-01-17 02:04 am UTC (link)
TY :)

(Reply to this)(Thread)


[info]aucune_gloire
2005-01-18 05:17 pm UTC (link)
YW, was it helpful?

(Reply to this)(Parent)

hi! thx this page has been a huge help, but i have one question
[info]inlanternlight
2005-03-25 12:11 am UTC (link)
I want to get rid of the
website | My Website ]
[ userinfo | livejournal userinfo ]
[ calendar | livejournal calendar ]

and replace it with
a <-----link for user info
wonder <-----link for friends
of <------link for myspace
technology <-----link for foki picture account

can you help me do this please?
aim: OHNOevilrobots
email: rusty@theboyrobot.com

(Reply to this)(Thread)

Re: hi! thx this page has been a huge help, but i have one question
[info]aucune_gloire
2005-03-26 03:15 am UTC (link)
Nope, I can't. There are plenty of livejournal help communities for that. Any questions posed here should be concerned with this tutorial only.

(Reply to this)(Parent)


[info]semaj_miasma
2005-04-20 03:41 am UTC (link)
What does tr an td stand for??!?
I should know, but, I don't.

(Reply to this)(Thread)


[info]aucune_gloire
2005-04-20 08:11 pm UTC (link)
As with HTML.
It's the row and column of your tables.

(Reply to this)(Parent)(Thread)


[info]semaj_miasma
2005-05-13 08:22 am UTC (link)
Do you have a more in depth tutorial I can read?
And if it's no problem, do you have the names of good communities that can just help with layout questions?

(Reply to this)(Parent)(Thread)


[info]aucune_gloire
2005-05-14 04:41 pm UTC (link)
hum, I dont have any other tutorials. This one was meant to explain what the codes mean not to show you how to do anything. >>; I dont know any communities offhand. You should do an lj search for it.

(Reply to this)(Parent)

Tables
[info]snochick916
2005-05-14 10:18 pm UTC (link)
I know what tables are for but what is it for..
Is it for the entries? The format of the whole LJ?
What would "table table table" be?

(Reply to this)(Thread)

Re: Tables
[info]aucune_gloire
2005-05-15 03:06 pm UTC (link)
xD I should've explained that.
Tables are for your the one entry square part:
All of the entries and their misc junk (date, mood, etc) on the page

Table table is </table>A single entry square (entry for that one day, music for that one day, etc) and the word 'navigation' at the bottom of the page.</b>

Table Table table is the same as above except with 3 table tags. That is:
The cells holding your music/mood and the bottom navigation.

(Reply to this)(Parent)

Re: Tables
[info]aucune_gloire
2005-05-15 03:07 pm UTC (link)
Table table is two table tags in a row. That corresponds to:
A single entry square (entry for that one day, music for that one day, etc) and the word 'navigation' at the bottom of the page.


xD.

(Reply to this)(Parent)

hey hey hey
[info]iwontb4gotten
2005-11-08 07:35 pm UTC (link)
ok ok i get the codes and everything but where exactly do we type em into?

(Reply to this)(Thread)

Re: hey hey hey
[info]aucune_gloire
2005-11-08 07:37 pm UTC (link)
The tutorial just shows you what they mean, not anything else.

(Reply to this)(Parent)


[info]fl4wed
2005-11-24 12:49 am UTC (link)
How do you change jsut the bold text color without screwing the rest of the layout up?

Also, how do I get my header image at the top, can I put it in a sperate table about the navigation?

(Reply to this)(Thread)


[info]aucune_gloire
2005-11-24 01:58 am UTC (link)
Comments are reserved for relevent questions only.

(Reply to this)(Parent)

Oh Thank You
[info]85lamb
2006-01-10 08:10 am UTC (link)
Your site has hepled alot!

(Reply to this)(Thread)

Re: Oh Thank You
[info]aucune_gloire
2006-01-10 07:32 pm UTC (link)
:D I'm glad!

(Reply to this)(Parent)


[info]save_le_empire
2006-01-26 03:38 am UTC (link)
Ditto what [info]85lamb said- your site is amazing, and now I don't have to pout over my lack of PS8 (well, not as much anyway ;D ). Thank you!

(Reply to this)


[info]__tabatha
2006-04-08 12:02 pm UTC (link)
very useful.. added it to my memories. :)

(Reply to this)


[info]drkangelyahriel
2006-05-22 08:38 pm UTC (link)
hey! That's a pretty handy reference, even outside of LJ! Thanks for posting!

(Reply to this)


[info]_hermitstyle
2006-07-12 12:54 am UTC (link)
ok, so I read all you wrote about table table tables, and I tried it all, but my damn tables are still so wide! They take up the whole screen and I cant figure out why... it blocks my background image! for now Im using refried paper so you can see it, but the layout (by reb) is meant to be for clean and simple... can you help?

(Reply to this)(Thread)


[info]aucune_gloire
2006-07-15 04:50 am UTC (link)
o_o if it's meant for clean and simple then can you change it to that?

(Reply to this)(Parent)(Thread)


[info]_hermitstyle
2006-07-21 12:06 am UTC (link)
it doesnt work on clean and simple, that was why it wasnt working. basically my tables take up the entire screen, no matter what style

(Reply to this)(Parent)(Thread)


[info]aucune_gloire
2006-07-21 01:21 am UTC (link)
>>; I can't really help you and see what's going on if it's not in the correct style.

(Reply to this)(Parent)(Thread)


[info]_hermitstyle
2006-07-23 05:46 am UTC (link)
ok, sorry! I'll change it

(Reply to this)(Parent)(Thread)


[info]aucune_gloire
2006-07-23 04:52 pm UTC (link)
It's working properly.

This FAQ question should answer it for you:
(http://www.ljlayouts.org/information.php?location=faq)

Q / Will these layouts work on sponsored+ accounts?
A / Sponsored+ accounts are journals who in exchange for advertising recieve extra features such as more userpics, mobile posting, and livejournal scrapbooking. If a layout you're using looks broken because you're a sponsored+ account, there is no way to fix this.

But you can try this solution
add before the

* {
border:0;}

That should get rid of the border.

(Reply to this)(Parent)(Thread)


[info]_hermitstyle
2006-07-23 04:59 pm UTC (link)
thank you so much!! i was lost.

(Reply to this)(Parent)


Create an Account
Forgot your login?
Login w/ OpenID
English • Español • Deutsch • Русский…