Synnyzter's blog: "Profile and lounge help..."

CSS AND HTML HELP
Below is the list of css used by CT. These can altered and copied into your profile or lounge to change the properties of certain objects.

lc_mainStyles.css
lc_stash.css
lc_styles.css
lc_user2.css
lc_sddm.css

They are somewhat self explanatory for example: This css code below can be found in "lc_mainstyles.css"

---

div.lounge_shoutbox { vertical-align:top; border:2px solid #660000; border-top:none; overflow:auto; width:400px; height:300px; padding:0px; scrollbar-base-color:#993333; scrollbar-arrow-color:white; scrollbar-track-color:black; scrollbar-shadow-color:#660000; scrollbar-lightshadow-color:white; scrollbar-darkshadow-color:#663333; scrollbar-highlight-color:#CC3333; scrollbar-3dlight-color:red; background-color:black; color:blue; padding-left:10px; padding-right:10px; /* left:0; top:0; position:relative; float:left; */ }

---

Simply copying this into the lounge MOTD and changing the line "width:400px;" to "width:600px;" will make the lounge chat area wider by 200 pixels.

Here are some very good and easy to understand examples of CSS.

CSS Background Examples

Set the background color
Set an image as the background
How to repeat a background image
How to repeat a background image only vertically
How to repeat a background image only horizontally
How to display a background image only one time
How to place the background image
How to position a background image using %
How to position a background image using pixels
A fixed background image (this image will not scroll with the rest of the page)
All the background properties in one declaration

Background properties explained

---

Text

Set the color of the text
Set the background-color of the text
Specify the space between characters
Specify the space between lines
Align the text
Decorate the text
Indent text
Control the letters in a text
Set the text direction of an element
Increase the white space between words
Disable text wrapping inside an element

Text properties explained

---

Font

Set the font of a text
Set a paragraph font using the "caption" value
Set the size of the font
Set the style of the font
Set the size of the font using font-size-adjust
Set the variant of the font
Set the boldness of the font
All the font properties in one declaration

Font properties explained

---

Border

All the border properties in one declaration
Set different borders on each side
All the top border properties in one declaration
All the bottom border properties in one declaration
All the left border properties in one declaration
All the right border properties in one declaration
Set the style of the four borders
Set the style of the top border
Set the style of the bottom border
Set the style of the left border
Set the style of the right border
All the width border properties in one declaration
Set the width of the top border
Set the width of the bottom border
Set the width of the left border
Set the width of the right border
Set the color of the four borders
Set the color of the top border
Set the color of the bottom border
Set the color of the left border
Set the color of the right border

Border properties explained

---

Outline

Draw a line around an element, outside the border edge (outline) (Does not work in IE)
Set the style of an outline (Does not work in IE)
Set the color of an outline (Does not work in IE)
Set the width of an outline (Does not work in IE)

Outline properties explained

---

Margin

All the margin properties in one declaration
Set the top margin of a text using a cm value
Set the top margin of a text using a percent value
Set the bottom margin of a text using a cm value
Set the bottom margin of a text using a percent value
Set the left margin of a text using a cm value
Set the left margin of a text using a percent value
Set the right margin of a text using a cm value
Set the right margin of a text using a percent value

Margin properties explained

---

Padding

Set the left padding of a tablecell
Set the right padding of a tablecell
Set the top padding of a tablecell
Set the bottom padding of a tablecell
All the padding properties in one declaration

Padding properties explained

---

List

The different list-item markers in unordered lists
The different list-item markers in ordered lists
All the list style types
Set an image as the list-item marker
Place the list-item marker
All list properties in one declaration

List properties explained

---

Table

Set the layout of a table
Show empty cells in a table
Collapse a table border
Set the space between table borders
Set the position of the table caption

Table properties explained

---

Dimension

Set the height of an image using a pixel value
Set the height of an image using percent
Set the width of an element using a pixel value
Set the width of an element using percent
Set the maximum height of an element
Set the maximum width of an element using a pixel value
Set the maximum width of an element using percent
Set the minimum height of an element
Set the minimum width of an element using a pixel value
Set the minimum width of an element using percent
Specify the space between lines using a percent value
Specify the space between lines using a pixel value
Specify the space between lines using a number value

Dimension properties explained

---

Classification

How to display an element as an inline element
How to display an element as a block element
A simple use of the float property
An image with border and margins that floats to the right in a paragraph
An image with a caption that floats to the right
Let the first letter of a paragraph float to the left
Creating a horizontal menu
Creating a homepage without tables
Position an element relative to its normal position
Position an element with an absolute value
Position an element relative to the browser window
How to make an element invisible
How to make a table element collapse
Change the cursor
Clear the sides of an element

Classification properties explained

---

Positioning

Position an element relative to its normal position
Position an element with an absolute value
Set the shape of an element
How to show overflow in an element using scroll
How to hide overflow in an element
How to show set the browser to automatically handle overflow
Vertical alignment of an image
Place an element "behind" another element
Place an element "behind" another element 2
Set the top edge of an image using a pixel value
Set the top edge of an image using a percent value
Set the bottom edge of an image using a pixel value
Set the bottom edge of an image using a percent value
Set the left edge of an image using a pixel value
Set the left edge of an image using a percent value
Set the right edge of an image using a pixel value
Set the right edge of an image using a percent value

Positioning properties explained

---

Generated Content

Changes the quotation marks on a page

---

Pseudo-classes

Add different colors to a hyperlink
Add other styles to hyperlinks
Hyperlink: use of :focus (does not work in IE)
:first-child (does not work in IE unless is declared)
:lang (does not work in IE)

Pseudo-classes explained

---

Pseudo-elements

Make the first letter special in a text
Make the first line special in a text
Make the first letter and first line special
Use :before to insert some content before an element (Does not work in IE)
Use :after to insert some content after an element (Does not work in IE)

---

Color Chart

To color specific text:

PLACE TEXT HERE Replace 6 digit color code with the color code you want from the chart below, this example makes the text lime green as shown below.

PLACE TEXT HERE

000000	000033	000066	000099	0000CC	0000FF
003300	003333	003366	003399	0033CC	0033FF
006600	006633	006666	006699	0066CC	0066FF
009900	009933	009966	009999	0099CC	0099FF
00CC00	00CC33	00CC66	00CC99	00CCCC	00CCFF
00FF00	00FF33	00FF66	00FF99	00FFCC	00FFFF
330000	330033	330066	330099	3300CC	3300FF
333300	333333	333366	333399	3333CC	3333FF
336600	336633	336666	336699	3366CC	3366FF
339900	339933	339966	339999	3399CC	3399FF
33CC00	33CC33	33CC66	33CC99	33CCCC	33CCFF
33FF00	33FF33	33FF66	33FF99	33FFCC	33FFFF
660000	660033	660066	660099	6600CC	6600FF
663300	663333	663366	663399	6633CC	6633FF
666600	666633	666666	666699	6666CC	6666FF
669900	669933	669966	669999	6699CC	6699FF
66CC00	66CC33	66CC66	66CC99	66CCCC	66CCFF
66FF00	66FF33	66FF66	66FF99	66FFCC	66FFFF
990000	990033	990066	990099	9900CC	9900FF
993300	993333	993366	993399	9933CC	9933FF
996600	996633	996666	996699	9966CC	9966FF
999900	999933	999966	999999	9999CC	9999FF
99CC00	99CC33	99CC66	99CC99	99CCCC	99CCFF
99FF00	99FF33	99FF66	99FF99	99FFCC	99FFFF
CC0000	CC0033	CC0066	CC0099	CC00CC	CC00FF
CC3300	CC3333	CC3366	CC3399	CC33CC	CC33FF
CC6600	CC6633	CC6666	CC6699	CC66CC	CC66FF
CC9900	CC9933	CC9966	CC9999	CC99CC	CC99FF
CCCC00	CCCC33	CCCC66	CCCC99	CCCCCC	CCCCFF
CCFF00	CCFF33	CCFF66	CCFF99	CCFFCC	CCFFFF
FF0000	FF0033	FF0066	FF0099	FF00CC	FF00FF
FF3300	FF3333	FF3366	FF3399	FF33CC	FF33FF
FF6600	FF6633	FF6666	FF6699	FF66CC	FF66FF
FF9900	FF9933	FF9966	FF9999	FF99CC	FF99FF
FFCC00	FFCC33	FFCC66	FFCC99	FFCCCC	FFCCFF
FFFF00	FFFF33	FFFF66	FFFF99	FFFFCC	FFFFFF

to be continued...

So I got a DUI on Labor Day, how awesome is that lol. Spent the night in jail with nothing to eat the whole damn time. It was fun, lemme tell ya!