Thursday, February 4, 2010

HOW TO CREATE CSS FILE and CLASSSESS

*{margin:0;padding:0}
* html,body{height:100%;width:100%;}
a{color:#000000;text-decoration:none; height :26px;}
a:link{ color: #000000;text-decoration:none; }
a:visited{ color: #0000ff;text-decoration:none;}
a:hover{color: #0000ff; text-decoration:underline; height :26px; padding:0px 0px 0px 0px; }
a:active{ color: #0000ff; text-decoration:none;padding:0px 0px 0px 0px;}

body
{
margin:0px auto;
padding:0px auto;
background-color: #FFFFFF;
text-align:center;

/*min-height:468px; for good browsers*/
/*min-width:916px; for good browsers*/
font-family: verdana, sans-serif;
font-size: 11px;
}
.Outer
{
clear:both;
width:950px;
min-width:950px;
min-height:468px;
margin:0px auto;
margin-top:auto;
margin-bottom:auto;
text-align:center;
border:1px solid #CCCCCC;
position:relative;
top:auto;
display:table;
vertical-align: middle;
}
.Menu
{
clear:both;
width:916px;
height:88px;
margin:0px auto;
/*border:1px solid #000000;min-width:916px;*/

background:url(Images/icon_bg.jpg) no-repeat;
}
.TopHeader
{
clear:both;
width:952px;
height:160px;
background-color: #f9f9f9;
background:url(buttons/Top_Banner.jpg) no-repeat;
}
.LeftSubMenu
{
clear:both;
float:left;
text-align:left;
/*line-height:20px;*/
padding:20px 0px 0px 17px;

width:223px;
vertical-align:middle;
/*background-color:#d6d6d6;

border:1px solid #000000;*/
background-color:#f9f9f9;
min-width:223px;
}
.LeftMenuHeader
{
margin:0px auto;
padding:0px auto;
height:31px;
width:223px;
text-align:center;
background:url(Images/left_menu_top.jpg) no-repeat;
}
.LeftMenuBottom
{
margin:0px auto;
padding:0px auto;
height:31px;
width:223px;
text-align:center;
background:url(Images/left_menu_bottom.jpg) no-repeat;
}
.Separater
{
margin:0px auto;
padding:0px auto;
height:24px;
width:223px;
text-align:center;
background:url(Images/Line_Image.jpg) no-repeat;

}
.RightContent
{
float:right;
padding:20px 5px 0px 0px;
margin:0px auto;
min-height:324px;
width:680px;
background-color:#f9f9f9;

}
.ContentTopBar
{
margin:0px auto;
padding:0px 0px 0px 0px;
height:31px;
width:660px;
text-align:center;
background:url(Images/Content_top_bg.jpg) no-repeat;
}

.Form
{
clear:both;
width:950px;
min-height:340px;
background-color:#FBFBFB;
/*background:url(Home/border.jpg) repeat-y;

border-left:2px solid #cccccc;
border-right:2px solid #cccccc;*/
}
.LeftTop
{
margin:0px auto;
float:left;
vertical-align:middle;
height:150px;
width:730px;


}
.RightTop
{
float:right;
height:150px;
width:200px;

}
.content
{
clear:both;
width:100%;
min-height:340px;
}
.ContentTopBg
{
height:29px;
width:660px;
background:url(buttons/ContentTopBg.jpg) no-repeat;
}
.ContentMidBg
{
width:660px;
background:url(buttons/ContentMidBg.jpg) repeat-y ;
}
.ContentFooterBg
{
height:5px;
width:660px;
background:url(buttons/ContentFooterBg.jpg) no-repeat;
}
.HomeFooter
{
clear:both;
width:952px;
height:80px;
background-color: #f9f9f9;
background:url(buttons/Bottom_Banner.jpg) no-repeat;
}

.Footer
{
text-align:right;
padding:0px 0px 0px 0px;
clear:both;
width:952px;
height:20px;
background-color: #f9f9f9;
/*background:url(buttons/Bottom_Banner.jpg) no-repeat;*/
}
.login_bg
{
margin:0px auto;
margin-top:15px;
width:311px;
height:232px;
background-color: #f9f9f9;
background:url(buttons/Login_Window.jpg) no-repeat;
}
.form_top_bg
{
margin:0px auto;
margin-top:15px;
width:731px;
height:32px;
background-color: #f9f9f9;
background:url(buttons/Form_Topbg.jpg) no-repeat;
}
.form_middle_bg
{
margin:0px auto;
margin-top:15px;
width:731px;
height:18px;
background-color: #f9f9f9;
background:url(buttons/Form_middlebg.jpg) repeat-y;
}
.form_bottom_bg
{
margin:0px auto;
margin-top:15px;
width:731px;
height:20px;
background-color: #f9f9f9;
background:url(buttons/Form_Bottombg.jpg) no-repeat;
}
/*watermark text box*/

.watermarked {
/*height:20px;*/
width:150px;
padding:2px 0px 0px 2px;
border:1px solid #BEBEBE;
background-color:#F0F8FF;
color:gray;
}
/* normal text */
.ContentHeaderTop
{
width:660px;
height:29px;
background:url(buttons/Content_Top_Header.jpg) no-repeat;
}
.ContentMiddleBg
{
width:660px;
background:url(buttons/Content_Middle_BG.jpg) repeat-y;
}
.TextStyle
{
clear:both;
margin :0px auto;
width:90%;
line-height:25px;
text-align:justify;
color :#000000;
}
.CountentFooter
{
width:660px;
height:5px;
background:url(buttons/Content_Bottom_Bg.jpg) no-repeat;
}
/* by Aatish Jadhav on 25 jan 2010 */
/*For Dashboard*/

.Dashboard_top_bg
{
margin:0px auto;
margin-top:15px;
width:248px;
height:44px;
background-color: #f9f9f9;
background:url(buttons/Dashboard_top_bg.jpg) no-repeat;
}
.Dashboard_middle_bg
{
margin:0px auto;
margin-top:15px;
width:248px;
height:20px;
background-color: #f9f9f9;
background:url(buttons/Dashboard_middle_bg.jpg) repeat-y;
text-align:center;
}
.Dashboard_bottom_bg
{
margin:0px auto;
margin-top:15px;
width:248px;
height:15px;
background-color: #f9f9f9;
background:url(buttons/Dashboard_bottom_bg.jpg) no-repeat;
}

No comments:

Post a Comment