Xboxer
02-02-2008, 09:04 PM
Hi,
I didn't build my site but purchase a pre-made social network software. The theme has two columns in all pages. I really like to have a small third column on the right side of the Homepage only, like Yahoo homepage. This is where I would like to put links for additional services.
How do I create a third column on homepage only?. I am allowed within 1000 words for the post so here is part my CSS file. Thanks.
.
.handler{
width:997px;
margin:0 auto;
padding:0;
}
.page{
background-color: #FFFFFF;
text-align:left;
float:left;
width:997px;
border-right: 1px solid #C4C7CC;
border-left: 1px solid #C4C7CC;
}
.top{
border-top: 7px solid #33CCFF;
height: 95px;
background-color:#FFFFFF;
}
.columnWide{
float:left;
width:680px;
}
.columnSmall{
float:left;
width:300px;
}
.padded{
padding:5px;
}
.dividerV{
float:left;
width:5px;
}
.dividerH{
float:none;
height:5px;
}
.dotted{
height:2px;
border-top: 1px dotted #999999;
}
.dotted-bottom{
padding:3px;
border-bottom: 1px dotted #999999;
}
.pages{
text-align:center;
}
.centered{
text-align:center;
}
.bold{
font-weight:bold;
}
/* text styles */
.topmenu a{
color: #4F6BA3;
text-decoration:none;
}
.topmenu a:hover{
text-decoration:underline;
}
.menubar a{
color: #FFFFFF;
text-decoration:none;
}
.menubar a:hover{
color: #345666;
}
.menubarON{
display:inline;
color: #345666;
font-weight: bold;
}
.blue{
color: #68ABCA;
font-weight:bold;
font-size:8pt;
}
h1{
font-family: "Trebuchet MS","Lucida Grande";
font-weight:bold;
font-size:12pt;
padding:0px;
margin:0;
}
.error{
color:#FF0000;
font-weight:bolder;
}
..highlight{
}
/
.blue-header{
background-color: #E1E9FA;
border: 1px solid #96ABD4;
font-family: "Trebuchet MS","Lucida Grande";
font-size: 10pt;
font-weight:bold;
padding:3px;
padding-left: 10px;
text-align:left;
color: #6D7B99;
}
.blue-body{
padding:5px;
background-color: #FFFFFF;
border-bottom: 1px solid #96ABD4;
border-right: 1px solid #96ABD4;
border-left: 1px solid #96ABD4;
}
.orange-header{
background-color: #FAEFE1;
border: 1px solid #D4BA96;
font-family: "Trebuchet MS","Lucida Grande";
font-size: 10pt;
font-weight:bold;
padding:3px;
padding-left: 10px;
text-align:left;
color: #99876D;
}
.orange-body{
padding:5px;
background-color: #FFFFFF;
border-bottom: 1px solid #D4BA96;
border-right: 1px solid #D4BA96;
border-left: 1px solid #D4BA96;
}
.grey-header{
background-color: #EDEDED;
border: 1px dashed #999999;
font-family: "Trebuchet MS","Lucida Grande";
font-size: 10pt;
font-weight:bold;
padding:3px;
padding-left: 10px;
text-align:left;
color: #808080;
}
.grey-body{
padding:5px;
background-color: #FAFAFA;
border-bottom: 1px dashed #999999;
border-right: 1px dashed #999999;
border-left: 1px dashed #999999;
}
.tip{
border: 1px dashed #D38828;
padding:5px;
color: #666666;
}
.tip-body{
}
.
/* notification */
.noti{
border:1px solid #6888CA;
background-color: #FFFFFF;
color: #666666;
}
.noti-header{
background-color: #6888CA;
padding:3px;
color: #FFFFFF;
font : 8pt Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
}
.noti-header a{
color: #FFFFFF;
font-weight:normal;
text-decoration:none;
}
.noti-body{
font : 8pt Verdana, Arial, Helvetica, sans-serif;
color: #666666;
}
.noti-body a{
color: #666666;
}
.noti-body a:hover{
text-decoration:none;
}
/* color selector */
.color-color{
margin:1px;
width:9px;
height:9px;
float:left;
cursor:pointer;
border:1px solid #000000;
}
/* albums */
.photo{
width:80px;
height:118px;
}
.photo_edit{
width:80px;
height:132px;
}
.photo_main{
background-color: #FA8072;
border: 1px solid #999999;
padding: 8px;
}
.album{
width:80px;
height:118px;
}
.album_main{
background-color: #FFE4E1;
border: 1px solid Black;
padding: 8px;
}
.album_big{
width:344px;
}
.album_edit{
width:80px;
height:142px;
}
.album-photo{
background-color: #DDDDDD;
border: 1px solid Black;
padding: 8px;
}
.album-caption{
background-color: #999999;
border-left: 1px solid Black;
border-right: 1px solid Black;
border-bottom: 1px solid Black;
padding: 2px;
height:42px;
}
.album_edit{
width:80px;
height:142px;
}
.album-text{
background-color: #999999;
font: 7pt Tahoma, sans-serif;
color: #F9F9F9;
}
.album-text a{
background-color: ##CCCCCC;
font: 7pt Tahoma, sans-serif;
color: #F9F9F9;
}
.album-text-big{
font: 8pt Tahoma, sans-serif;
color: #F9F9F9;
}
I didn't build my site but purchase a pre-made social network software. The theme has two columns in all pages. I really like to have a small third column on the right side of the Homepage only, like Yahoo homepage. This is where I would like to put links for additional services.
How do I create a third column on homepage only?. I am allowed within 1000 words for the post so here is part my CSS file. Thanks.
.
.handler{
width:997px;
margin:0 auto;
padding:0;
}
.page{
background-color: #FFFFFF;
text-align:left;
float:left;
width:997px;
border-right: 1px solid #C4C7CC;
border-left: 1px solid #C4C7CC;
}
.top{
border-top: 7px solid #33CCFF;
height: 95px;
background-color:#FFFFFF;
}
.columnWide{
float:left;
width:680px;
}
.columnSmall{
float:left;
width:300px;
}
.padded{
padding:5px;
}
.dividerV{
float:left;
width:5px;
}
.dividerH{
float:none;
height:5px;
}
.dotted{
height:2px;
border-top: 1px dotted #999999;
}
.dotted-bottom{
padding:3px;
border-bottom: 1px dotted #999999;
}
.pages{
text-align:center;
}
.centered{
text-align:center;
}
.bold{
font-weight:bold;
}
/* text styles */
.topmenu a{
color: #4F6BA3;
text-decoration:none;
}
.topmenu a:hover{
text-decoration:underline;
}
.menubar a{
color: #FFFFFF;
text-decoration:none;
}
.menubar a:hover{
color: #345666;
}
.menubarON{
display:inline;
color: #345666;
font-weight: bold;
}
.blue{
color: #68ABCA;
font-weight:bold;
font-size:8pt;
}
h1{
font-family: "Trebuchet MS","Lucida Grande";
font-weight:bold;
font-size:12pt;
padding:0px;
margin:0;
}
.error{
color:#FF0000;
font-weight:bolder;
}
..highlight{
}
/
.blue-header{
background-color: #E1E9FA;
border: 1px solid #96ABD4;
font-family: "Trebuchet MS","Lucida Grande";
font-size: 10pt;
font-weight:bold;
padding:3px;
padding-left: 10px;
text-align:left;
color: #6D7B99;
}
.blue-body{
padding:5px;
background-color: #FFFFFF;
border-bottom: 1px solid #96ABD4;
border-right: 1px solid #96ABD4;
border-left: 1px solid #96ABD4;
}
.orange-header{
background-color: #FAEFE1;
border: 1px solid #D4BA96;
font-family: "Trebuchet MS","Lucida Grande";
font-size: 10pt;
font-weight:bold;
padding:3px;
padding-left: 10px;
text-align:left;
color: #99876D;
}
.orange-body{
padding:5px;
background-color: #FFFFFF;
border-bottom: 1px solid #D4BA96;
border-right: 1px solid #D4BA96;
border-left: 1px solid #D4BA96;
}
.grey-header{
background-color: #EDEDED;
border: 1px dashed #999999;
font-family: "Trebuchet MS","Lucida Grande";
font-size: 10pt;
font-weight:bold;
padding:3px;
padding-left: 10px;
text-align:left;
color: #808080;
}
.grey-body{
padding:5px;
background-color: #FAFAFA;
border-bottom: 1px dashed #999999;
border-right: 1px dashed #999999;
border-left: 1px dashed #999999;
}
.tip{
border: 1px dashed #D38828;
padding:5px;
color: #666666;
}
.tip-body{
}
.
/* notification */
.noti{
border:1px solid #6888CA;
background-color: #FFFFFF;
color: #666666;
}
.noti-header{
background-color: #6888CA;
padding:3px;
color: #FFFFFF;
font : 8pt Verdana, Arial, Helvetica, sans-serif;
font-weight:bold;
}
.noti-header a{
color: #FFFFFF;
font-weight:normal;
text-decoration:none;
}
.noti-body{
font : 8pt Verdana, Arial, Helvetica, sans-serif;
color: #666666;
}
.noti-body a{
color: #666666;
}
.noti-body a:hover{
text-decoration:none;
}
/* color selector */
.color-color{
margin:1px;
width:9px;
height:9px;
float:left;
cursor:pointer;
border:1px solid #000000;
}
/* albums */
.photo{
width:80px;
height:118px;
}
.photo_edit{
width:80px;
height:132px;
}
.photo_main{
background-color: #FA8072;
border: 1px solid #999999;
padding: 8px;
}
.album{
width:80px;
height:118px;
}
.album_main{
background-color: #FFE4E1;
border: 1px solid Black;
padding: 8px;
}
.album_big{
width:344px;
}
.album_edit{
width:80px;
height:142px;
}
.album-photo{
background-color: #DDDDDD;
border: 1px solid Black;
padding: 8px;
}
.album-caption{
background-color: #999999;
border-left: 1px solid Black;
border-right: 1px solid Black;
border-bottom: 1px solid Black;
padding: 2px;
height:42px;
}
.album_edit{
width:80px;
height:142px;
}
.album-text{
background-color: #999999;
font: 7pt Tahoma, sans-serif;
color: #F9F9F9;
}
.album-text a{
background-color: ##CCCCCC;
font: 7pt Tahoma, sans-serif;
color: #F9F9F9;
}
.album-text-big{
font: 8pt Tahoma, sans-serif;
color: #F9F9F9;
}