Posts for the Coding Category

New Friendster Layout Style Tutorial

Posted on May 28th, 2008 by xsabrina.chic | Filed Under » Coding, Tutorials | 78 Comments

New Friendster Layout Style by xsabrina.chic of vixenart.net. Just want to remind you that this kind of Friendster Layout Style is just my own idea. If you want to use my whole code as your pattern please DO NOT remove my name as credit. Also, please DO NOT claim the style and code as yours.


Use this code for the upper left image header:
Note: The image to use as header must be 490px in width.
I just added the width property


/* FRIENDSTER MAGIC & VIXENART.NET */
#navigation {
background-image: url(URL OF IMAGE HERE);
height: 65px !important;
position: relative !important;
margin: -10px 0 0 0;
padding: 130px 0 0 0;
background-attachment:scroll;
background-repeat: no-repeat;
background-position: top left;
background-color: #000000;
width: 490px;
}


[Read More...]

Advertisements

Navigational CSS Coding Tricks

Posted on April 15th, 2008 by xsabrina.chic | Filed Under » Coding, Tutorials | 63 Comments

THESE TRICKS ARE FULLY SELF-CODED BY xSABRINA.CHIC
Please do not remove credits.
SCROLLBAR COLOR [+] (IE users)
/* SCROLLBAR xsabrina.chic’s code - vixenart.net */
html{
scrollbar-arrow-color: #;
scrollbar-track-color: #;
scrollbar-face-color: #;
scrollbar-highlight-color: #;
scrollbar-3dlight-color: #;
scrollbar-darkshadow-color: #;
scrollbar-shadow-color: #;
}
SEARCH SUB NAVIGATION LINKS [+]
/* SEARC SUBNAV xsabrina.chic’s code - vixenart.net */
#subnav_search #subnav{
color: #;
}
#subnav_search [...]

Navigational CSS Layout Plus Designing Tutorial

Posted on April 15th, 2008 by xsabrina.chic | Filed Under » Coding, Designing, Tutorials | 136 Comments

Requirements:
* Adobe Photoshop in any Version
* Notepad
* Creativity
* Patience
Think and imagine first on what would be the design of your Friendster Layout.
As the tutorial will start, this is just my own desire. Choose your own and be creative.
By this time I’m using Adobe Photoshop CS3, but you can follow the step if you have other [...]