Centering div on mindle page (horizontal & vertical)

 

css code:

#centerVerticalHorizontal{
width:725px; /* widthvalue */
height:530px; /* height value */
position:absolute;
top:50%;
left:50%;
margin:-265px 0 0 -362px; /*value that height and width devide 2*/
}

CSS Pseudo Classes

• link – this is a link that has not been used, nor is a mouse pointer hovering over it
• visited – this is a link that has been used before, but has no mouse on it
• hover – this is a link currently has a mouse pointer hovering over it/on it
• active – this is a link that is in the process of being clicked

Example:

a:link {color:#FF0000;}
a:visited {color:#00FF00;}
a:hover {color:#FF00FF;}
a:active {color:#0000FF;}

Note: The states must be defined in the correct order

Scroll area with overflow in CSS

CSS overflow  property :

• overflow: auto – This will create a scrollbar – horizontal, vertical or both only if the content in the block requires it. For practical web development, this is probably the most useful approach to creating a scrollbar.
• overflow: scroll – This will will insert horizontal and vertical scrollbars. They will become active only if the content requires it.
• overflow: visible – This will cause the content of the block to expand outside of it and be visible at the same time.
• overflow: hidden – This forces the block to only show content that fits in the block. Other content will be clipped and not visible. There will be no scrollbars

CSS Example :

#scroll {
height: 200px;
width: 300px;
overflow: auto;
border: 1px solid #666;
background-color: #ccc;
padding: 8px;
}