Hi im trying to format this!

background-color

Applies a solid background color. Value can be a color name - for some colors - a hexadecimal color code (covered later) or transparent. background-image Gives the element a background image. Value should be url('image.ext'), where image.ext should be the path to the background image; for example, if I wanted an image called background.gif inside a folder called images on some element, I'd use background-image:url('images/background.gif'). Note that in an external stylesheet, the image path should be relative to the folder the stylesheet is in. background-attachment Value can be scroll or fixed. The default is scroll, but if it is fixed, the background image will stay in place if the text is scrolled down. Because Internet Explorer 6 renders this fixed effect incorrectly on everything but the body, I recommend not using it on anything else unless you know what you're doing. background-repeat Determines whether the background image should repeat. Value can be repeat, which is the default and makes it repeat until it covers the whole background of the element; no-repeat, which causes it only to appear once at the specified background-position; repeat-x, which will cause it to repeat horizontally but not vertically; and repeat-y, which will make it repeat vertically but not horizontally. background-position Positions the background image - mainly useful when the background-repeat is set to repeat-x, repeat-y or no-repeat. Value should be two keys for the vertical and horizontal positioning, which can be percentages, absolute values or keywords - top, bottom, left, right and center. The defined point in the element the background image is applied to is then lined up with a corresponding point in the image - meaning that if you put center center, the image's center point will be put right where the element's center point is, making it look properly centered. background A property that basically combines those - you could for example use background:url('dpsprites/001bulbasaur.png') #FFFFFF fixed top left no-repeat;. Positioning, Dimensions, Padding, Borders and Overflow position Determines how the position of the element should be calculated. The default value is static, which makes the element stay where it should be in the normal document flow. Then there is relative, which allows you to shift the element up/right/down/left from where it would otherwise be, and absolute, which will position it in relation to a positioned element that it is contained by - if you want to absolutely position an element but don't want to move the containing element anywhere, just give the containing element relative as its position. fixed also exists, but as Internet Explorer 6 does not support it, I will not detail its usage here. left, right, top and bottom Value can be given in px, em or %. If the element has position:relative, it will shift the element by that distance away from the direction denoted by the property used; if it has position:absolute, it will be positioned this distance away from the respective edge of the container that it is being positioned relative to. width Specifies the width of the element. The default value is auto, which will for a block-level element basically make it take up all the available horizontal space, or for an inline element make it take up exactly the space that it needs and no more. It can also be a value specified in px, em or % (of the containing element). Internet Explorer has an annoying thing for expanding elements past their specified width if their content is too large to fit into them, but this is incorrect behaviour. See overflow for the solution. height Specifies the height of the element, and the default value is auto like for width; however, here auto means taking up no more space than necessary in both inline and block-level elements. Like width, it can also be specified in px, em or % (relative to the containing element), and Internet Explorer also loves to ignore your specified height if the content is too big for it. margin Split into margin-top, margin-right, margin-bottom and margin-left, but you may just want to specify it all in one by giving the margin property four values specifying, in order, the top, right, bottom and left margin, with spaces in between. You can also give it two values, for which the former will apply to the top and bottom and the latter to the left and right, three values, for which the second value applies to both the left and right margins, or one value, for which all four margins will be the same size. margin basically puts margins on the sides of an element, pushing it away from the other elements on the page. The value can be given in px, em or % (which then refers to percentages of the containing element), or alternatively as auto, which will make the browser calculate a margin according to the width of the element and the opposite margin if any. This is useful mainly because it means that if you have an element and specify a width on it, you can center it by putting the left and right margins to auto - a trick which, unfortunately, apparently does not work in Internet Explorer 5.x. (This can be easily solved by also giving the containing element text-align:center and then negating it on the child, since as it happens Internet Explorer 5.x also incorrectly made the text-align property apply to the position of child elements as well.) padding Like margin, padding is technically shorthand for the top, right, bottom and left paddings. It is used almost exactly like margin, with one important exception: paddings are actually "inside" the element. That is, if you have margins on an element which, say, has a red background color, the red color will only reach as far as the contents of the element, and the margins will be transparent. However, if you have paddings on the element, it will leave a red space as wide as the padding you specify on the sides of the element. Unlike margins, paddings also can not be specified in percentages or as auto. One important thing to note about padding is that in the most infamous Internet Explorer bug of all time, it used to use a different box model than the W3C standard. That is, while the paddings are supposed to go outside the specified width or height, Internet Explorer would put the padding inside the dimensions, so that if you for example had an element with a width and height of 100px and gave it 10px paddings on all sides, the content would have only an 80x80 area in the middle of the element in Internet Explorer while it was supposed to have the full 100x100 area with the 10px paddings added outside that. While it can be argued that Internet Explorer's box model makes more sense than the W3C one, going against the web standards in this way caused headaches for web developers for years. In Internet Explorer 6 and 7, the standard box model is used if you have a strict doctype (which you do, if you followed all my instructions). Keep this in mind when making your layouts. border Rather self-explanatorily, this adds a border to the element, which is placed between the padding and margin (if any). This is shorthand for border-width, border-style and border-color, and like with the other shorthand properties, you just specify them in that order with a space between them. For example, a black, solid 1px border would be specified as border:1px solid black (or border:1px solid #000000). The width and color are self-explanatory; the style can be none, dotted, dashed, solid, double, groove, ridge, inset or outset. To specify only one of the four borders, use border-top, border-right, border-bottom or border-left. (The border-width property is technically shorthand as well; you can specify four individual values for the four borders, using it like how you would specify padding or margin.) The borders were also a problem in the Internet Explorer box model, as like with the paddings, Internet Explorer's rendering engine rendered the borders inside the specified width of the element. overflow Specifies what should be done with the element if the content in it exceeds the specified width or height. Phew, that's enough CSS for now, isn't it? Lastly, we'll just have a quickie on...