No replies
kalyanverma
Offline
newbie
Last seen: 14 years 15 weeks ago
Joined: 2008-06-11
Posts: 1
Points: 0

Hi All,

Im new to CSS. I was building a website using a CSS1. However i did not like the menu so downloaded menu CSS file (CSS2). How do i use CSS1 to take CSS2 just for the Menu. below are the codes for both the CSS. I hope you understand my question. Thanks in advance.

CSS1:

/* CSS Document */
body{padding:0px; margin:17px 0 0; background:url(images/mainbg.gif) 0 0 repeat-x #F3F3F3; color:#6D6D6D; font:14px/18px Arial, Helvetica, sans-serif;}
div, p, ul, li, h1, h2, h3, h4{padding:0px; margin:0px;}
ul{list-style-type:none;}
 
/*----MAIN PANEL----*/
#mainPan{width:778px; position:relative; margin:0 auto;}
 
/*----TOP PANEL----*/
#topPan{width:778px; height:330px; background:url(images/topbg.jpg) 0 0 no-repeat; position:relative; margin:0 auto;} 
#topPan img.logo{width:230px; height:44px; position:absolute; top:48px; left:26px;}
#topPan h1{width:241px; height:78px; display:block; background:url(images/header.jpg) 0 0 no-repeat #F3F3F3; color:#fff; position:absolute; top:114px; left:0px; font-size:12px; font-weight:bold; line-height:16px; padding:73px 186px 0 53px;}
#topPan h2{width:200px; height:25px; display:block; position:absolute; bottom:0px; left:53px; background:#fff; color:#B88F00; font:22px/25px Georgia, "Times New Roman", Times, serif;}
 
#topPan ul{width:438px; height:16px; display:block; position:absolute; top:64px; right:45px;}
#topPan ul li{width:59px; height:16px; float:left;}
#topPan ul li a{width:47px; height:16px; display:block; background:url(images/arrow3.gif) 0 6px no-repeat #fff; color:#5A5A5A; font-size:13px; text-decoration:none; padding:0 0 0 12px;}
#topPan ul li a:hover{background:url(images/arrow4.gif) 0 6px no-repeat #fff; color:#5A5A5A; text-decoration:none;}
#topPan ul li.about{width:80px;}
#topPan ul li.about a{width:70px; height:16px; display:block; background:url(images/arrow3.gif) 0 6px no-repeat #fff; color:#5A5A5A; font-size:13px; text-decoration:none; padding:0 0 0 12px;}
#topPan ul li.about a:hover{background:url(images/arrow4.gif) 0 6px no-repeat #fff; color:#5A5A5A; text-decoration:none;}
 
 
#toprightPan{width:300px; height:151px; background:url(images/specialbg.jpg) 0 0 no-repeat #F3F3F3; color:#fff; position:absolute; top:114px; right:0px;}
#toprightPan p{padding:64px 76px 0 59px; font-size:12px; font-weight:bold; line-height:16px;}
 
#toprightPan p.more{padding:13px 0 0; font-size:13px; font-weight:bold;}
#toprightPan p.more a{width:130px; height:23px; display:block; background:url(images/viewmore.gif) 0 0 no-repeat #EFBA00; color:#A98401; line-height:21px; text-decoration:none; margin:0 0 0 56px; padding:0 0 0 35px;}
#toprightPan p.more a:hover{display:block; background:url(images/viewmore-hover.gif) 0 0 no-repeat #EFBA00; color:#A98401; text-decoration:none;}
 
 
 
/*----/TOP PANEL----*/
 
/*----BODY PANEL----*/
#bodyTopPan{width:778px; height:234px; position:relative; margin:0 auto;}
#bodyTopPan p{padding:23px 53px 0;}
#bodyTopPan p span{font-weight:bold;}
#bodyTopPan p.more{width:73px; height:26px; background:url(images/morebg.gif) 0 0 no-repeat; position:absolute; bottom:0px; right:0px; padding:0px;}
#bodyTopPan p.more a{display:block; width:48px; height:20px; background: url(images/arrow1.gif) 100% 50% no-repeat #fff; color:#A98401; font-size:13px; font-weight:bold; text-decoration:none; margin:3px 0 0 12px;}
#bodyTopPan p.more a:hover{background: url(images/arrow2.gif) 100% 50% no-repeat #fff; color:#A98401; text-decoration:none;}
 
/*----Body Left Panel---*/
#leftPan{width:538px; float:left; background:url(images/body-bottombg.gif) bottom left no-repeat #fff; color:#6D6D6D;}
#leftPan ul{width:538px; height:102px; background:url(images/togel.gif) 0 0 no-repeat; margin:0px; padding:0px;}
#leftPan ul li{width:110px; height:52px; float:left;}
#leftPan ul li a{width:110px; height:22px; display:block; background:#fff; color:#6D6D6D; text-decoration:none; font:20px/22px Georgia, "Times New Roman", Times, serif;}
#leftPan ul li a:hover{background:#fff; color:#B88F00; text-decoration:none;}
#leftPan ul li.positioncommunity{padding:20px 0 0 53px; background:#fff; color:#B88F00; font:20px/22px Georgia, "Times New Roman", Times, serif;}
#leftPan ul li.positionsolutions{padding:20px 0 0 100px;}
#leftPan ul li.positionmeetings{padding:20px 0 0 40px;}
 
#leftPan ul.next{background:none; height:164px;}
#leftPan ul.next li{height:24px; width:413px; padding:0 0 0 53px;}
#leftPan ul.next li a{height:24px; width:413px; background:url(images/buttet1.gif) 0 11px no-repeat #fff; color:#6D6D6D; font-size:14px; font-weight:normal; line-height:24px; text-decoration:none; padding:0 0 0 15px;}
#leftPan ul.next li a:hover{height:24px; background:url(images/buttet2.gif) 0 11px no-repeat #fff; color:#B88F00; line-height:24px; text-decoration:none;}
 
 
 
#leftPan h2{width:250px; height:41px; display:block; background:url(images/icon1.gif) 0 0 no-repeat #fff; color:#B88F00; font-size:12px; line-height:18px; font-weight:bold; margin:0 0 0 53px; padding:0 0 0 52px; text-transform:uppercase;}
#leftPan h2 span{font-size:12px; line-height:18px; font-weight:bold; background:#fff; color:#0554AD;}
 
#leftPan h3{width:250px; height:41px; display:block; background:url(images/icon4.gif) 0 0 no-repeat #fff; color:#3D3D3D; font:18px/22px "Trebuchet MS",Arial, Helvetica, sans-serif; margin:0 0 0 53px; padding:0 0 0 30px;}
 
#leftPan h4{width:250px; height:41px; display:block; background:url(images/icon1.gif) 0 0 no-repeat #fff; color:#B88F00; font-size:12px; line-height:18px; font-weight:bold; margin:0 0 0 53px; padding:0 0 0 52px; text-transform:uppercase;}
#leftPan h4 span{font-size:12px; line-height:18px; font-weight:bold; background:#fff; color:#0554AD;}
 
 
#leftPan p{padding:20px 53px 0;}
#leftPan p span{font-weight:bold;}
#leftPan p.bottompadding{padding:40px 53px;}
 
#bodyleftlinkboxonePan{width:428px; height:50px; display:block; margin:25px 0 0  53px; padding:0px;}
#bodyleftlinkboxonePan ul{width:428px; height:28px; background:none; font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;}
#bodyleftlinkboxonePan ul li{display:block; width:148px; height:34px; float:left;}
#bodyleftlinkboxonePan ul li.comments{width:110px; height:28px; display:block; background:url(images/icon2.gif) 0 0 no-repeat #fff; color:#1A5BB2; font-size:14px; font-weight:normal; padding:0 0 0 35px;}
#bodyleftlinkboxonePan ul li.comments span.boldtext{font-weight:bold;}
 
#bodyleftlinkboxonePan ul li.continue{float:left; width:150px; height:34px; background:url(images/icon3.gif) 0 0 no-repeat; padding:2px 0 0 35px; }
#bodyleftlinkboxonePan ul li.continue a{display:block; width:150px; height:18px; background:#fff; color:#1A5BB2; font-size:14px; line-height:18px; font-weight:normal; text-decoration:none; }
#bodyleftlinkboxonePan ul li.continue a:hover{display:block; height:18px; background:#F4F4F4; color:#B88F00; text-decoration:none;}
 
#bodyleftlinkboxtwoPan{width:428px; height:50px; display:block; margin:25px 0 0  53px; padding:0px;}
#bodyleftlinkboxtwoPan ul{width:428px; height:28px; background:none; font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;}
#bodyleftlinkboxtwoPan ul li{display:block; width:148px; height:34px; float:left;}
#bodyleftlinkboxtwoPan ul li.comments{width:110px; height:28px; display:block; background:url(images/icon2.gif) 0 0 no-repeat #fff; color:#1A5BB2; font-size:14px; font-weight:normal; padding:0 0 0 35px;}
#bodyleftlinkboxtwoPan ul li.comments span.boldtext{font-weight:bold;}
 
#bodyleftlinkboxtwoPan ul li.continue{float:left; width:150px; height:34px; background:url(images/icon3.gif) 0 0 no-repeat; padding:2px 0 0 35px; }
#bodyleftlinkboxtwoPan ul li.continue a{display:block; width:150px; height:18px; background:#fff; color:#1A5BB2; font-size:14px; line-height:18px; font-weight:normal; text-decoration:none; }
#bodyleftlinkboxtwoPan ul li.continue a:hover{display:block; height:18px; background:#F4F4F4; color:#B88F00; text-decoration:none;}
/*----/Body Left Panel---*/
 
/*----Body Right Panel---*/
#bodyrightPan{width:240px; float:left;}
#bodyrightPan h2{height:55px; font:22px/55px Georgia, "Times New Roman", Times, serif; background:#F3F3F3; color:#B88F00; font-weight:normal; margin:0 0 0 44px;}
 
#bodyrightPan p{padding:11px 75px 0 44px;}
#bodyrightPan p.toppadding-rightpantext{padding:33px 67px 0 44px;}
#bodyrightPan p span{padding:11px 0 25px 0; font-size:12px; font-weight:bold;}
/*----/Body Right Panel---*/
 
/*----FOOTER PANEL---*/
#footermainPan{height:195px; background:url(images/footerbg.gif) 0 0 repeat-x; clear:both;}
 
#footerPan{width:778px; height:90px; display:block; position:relative; margin:0 auto; color:#fff; background:url(images/footerbg.gif) 0 0 repeat-x #979797; font-family:Tahoma,Arial, Helvetica, sans-serif;}
#footerPan p{padding:51px 0 0;}
#footerPan p span{background:#1C1B19; color:#AC2626; font-size:10px;}
#footerPan p.copyright{ background:#979797; display:block; position:absolute; top:130px; left:192px; color:#fff; font:11px/15px Tahoma,Arial, Helvetica, sans-serif; padding:0;}
 
#footerPan ul{width:424px; display:block; position:absolute; left:120px; top:41px; padding:0; }
#footerPan li{float:left; font:13px/18px Arial, Helvetica, sans-serif; font-weight:normal;}
#footerPan ul li a{padding:0 0 0 12px; color:#fff; background:#979797; text-decoration:none;}
#footerPan ul li a:hover{text-decoration:underline;}
#footerPan ul.info{width:424px; height:45px; display:block; position:absolute; left:120px; top:70px; padding:0;}
#footerPan ul.info li{display:block; width:109px;}
#footerPan ul.info li.address{width:97px; background:url(images/vertical-dot.gif) 100% 0 repeat-y #979797; color:#353535; font-size:10px; font-family:Tahoma,Arial, Helvetica, sans-serif;  font-weight:bold; padding:0 0 0 12px;}
#footerPan ul.info li.phone{width:94px; background:url(images/vertical-dot.gif) 100% 0 repeat-y #979797; color:#353535; font-family:Tahoma,Arial, Helvetica, sans-serif; font-size:10px; padding:0 0 0 15px; font-weight:bold;}
#footerPan ul.info li.fax{width:94px; background:#979797; color:#353535; font-size:10px; padding:0 0 0 15px; font-family:Tahoma,Arial, Helvetica, sans-serif; font-weight:bold;}
#footerPan ul li span{background:#979797; color:#FFDB5D; font-size:10px; font-weight:bold; line-height:18px;}
 
#footerPan ul.templateworld{width:250px; background:#979797; color:#fff; display:block; position:absolute; top:147px; left:192px;}
#footerPan ul.templateworld li{widows:150; font-size:11px;}
#footerPan ul.templateworld li a{background:#979797; display:block; color:#fff; text-decoration:none;}
#footerPan ul.templateworld li a:hover{text-decoration:underline;}

CSS2 (The Menu CSS)

body {
	font: bold 11px/1.5em Verdana;
	}
 
h1 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	margin:0;
	padding:0;
	}
 
hr {
	border:none;
	border-top:1px solid #CCCCCC;
	height:1px;
	margin-bottom:25px;
	}
 
#tabs {
	float:left;
	width:100%;
	background:#F4F4F4;
	font-size:93%;
	line-height:normal;
	}
 
#tabs ul {
	margin:0;
	padding:10px 10px 0 50px;
	list-style:none;
	}
 
#tabs li {
	display:inline;
	margin:0;
	padding:0;
	}
 
#tabs a {
	float:left;
	background:url("tableft.gif") no-repeat left top;
	margin:0;
	padding:0 0 0 4px;
	text-decoration:none;
	}
 
#tabs a span {
	float:left;
	display:block;
	background:url("tabright.gif") no-repeat right top;
	padding:5px 15px 4px 6px;
	color:#666;
	}
 
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs a span {float:none;}
 
/* End IE5-Mac hack */
#tabs a:hover span {
	color:#000;
	}
 
#tabs a:hover {
	background-position:0% -42px;
	}
 
#tabs a:hover span {
	background-position:100% -42px;
	}