Sometimes, for reasons that elude me, you can not use a class or an id for an element placed within another element that already uses a class or an id. To get around this you must define the element you want to style in your style sheet as a sub element of the principal class or id.

For example, if you want to have an image within a div and you want both the div and the image to use style sheet defined properties, then your style sheet should look like this:

.div {
define properties for the div
}

.div img {
define properties for the image within the div
}

You could also use id instead of class and it would then look like:

#div {
define properties for the div
}

#div img {
define properties for the image within the div
}

This is easily done with css.

Capital letters inline

test -> TEST

Small letters inline

Test -> test

Capital letters stylesheet class

.capital {
text-transform: uppercase;
}

Small letters stylesheet class

.small {
text-transform: lowercase;
}

Margin increases the distance between the border of your current object and other objects. Padding increases the distance between content and border within your current object. Both parameters are easily configured via css.

margin: top right bottom left

padding: top right bottom left