Mood » Thanks for dropping your comments! I can't answer some questions as of now. I'm too busy T___T

Navigational CSS Coding Tricks

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

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 #subnav a{
color: #;
}
#subnav_search #subnav a:hover{
color: #;
text-decoration: ;
}

FOOTER [+]
/* FOOTER xsabrina.chic's code - vixenart.net */
#footer{
color: #;
background-color: #;
background-image: url();
padding: 20px 0;
}
#footer a{
color: #;
text-decoration: ;
}
#footer a:hover{
color: #;
text-decoration: ;
}

SHOUTOUT BOX [+] (FF users)
/* SHOUTOUT BOX xsabrina.chic's code - vixenart.net */
#cpShoutoutBox{
background-color: #a22b2b;
border: 2px solid #000000;
display: block;
color: #e88eae;
}
.sob{display:none;background:transparent;}
.sol{display:none;background:transparent;}

TRACKER [+] (FF users)
/* TRACKER xsabrina.chic's code - vixenart.net */
.user_tracker{
background-color: #a22b2b;
border: 2px solid #000000;
color: #e88eae;
}


HOW YOU’RE CONNECTED FONT [+]
#meettrail .commonbox h2 .commonbox h2{
color: #;
text-transform: lowercase;
}

MASTER HEADERS INDIVIDUAL IMAGE (See All Headers each Boxes) → VA Fan Profile
Master Headers must be like this:
/* MASTER HEADERS editfriendster.com */
.commonbox h1, .commonbox h2 {
font-size: 0px;
}

And ADD this code:
Master Headers Individual Image Code
/* MASTER HEADERS INDIVIDUAL IMAGE xsabrina.chic's code - vixenart.net */
.controlpanel h1#controlpanel_header{
background: url(http://img266.imageshack.us/img266/2521/h1je7.gif) no-repeat;
}
.photos h2{
background: url(http://img266.imageshack.us/img266/9342/h2qs9.gif) no-repeat;
}
.moreabout h2{
background: url(http://img406.imageshack.us/img406/7533/h3zq8.gif) no-repeat;
}
.friends h2{
background: url(http://img406.imageshack.us/img406/5668/h4rc9.gif) no-repeat;
}
.videos h2{
background: url(http://img406.imageshack.us/img406/9283/h5th0.gif) no-repeat;
}
.groups h2{
background: url(http://img291.imageshack.us/img291/3850/h6yw9.gif) no-repeat;
}
.testimonials h2{
background: url(http://img406.imageshack.us/img406/7042/h7bk8.gif) no-repeat;
}
.testimonialscomments h2{
background: url(http://img291.imageshack.us/img291/7196/h8oy3.gif) no-repeat;
}
.scrapbook h2{
background: url(http://img442.imageshack.us/img442/1460/h9wh5.gif) no-repeat;
}
.fanof h2{
background: url(http://img442.imageshack.us/img442/7944/h10ed5.gif) no-repeat;
}
.myfans h2{
background: url(http://img187.imageshack.us/img187/7907/h11hl6.gif) no-repeat;
}
.reviews h2{
background: url(http://img187.imageshack.us/img187/816/h12ra4.gif) no-repeat;
}
.blogs h2{
background: url(http://img153.imageshack.us/img153/5585/h13jy2.gif) no-repeat;
}
.blogsreviews h2{
background: url(http://img187.imageshack.us/img187/340/h14qf4.gif) no-repeat;
}
.publiccomments h2{
background: url(http://img153.imageshack.us/img153/7840/h15fx3.gif) no-repeat;
}

But if you want single Image for all headers, simply use this:
/* MASTER HEADERS editfriendster.com */
color: #;
text-transform: uppercase;
background-color: #;
background-image: url();
background-repeat: ;
text-align:center;
}

WANT FLOATING BORDERS? [+]
Code from Friendster-Tweakers
/* FLOATING PAGE EFFECT - FRIENDSTER-TWEAKERS.COM */
body {
border-style: groove;
border-top-color: #;
border-bottom-color: #;
border-left-color: #;
border-right-color: #;
border-top-width: 55px;
border-bottom-width: 55px;
border-left-width: 55px;
border-right-width: 55px;
}

30 Comments to Navigational CSS Coding Tricks

  1. johndel
    August 19th, 2008 at 3:58 am

    san banda ilalagay ung floating border
    thnx

  2. andrea
    August 14th, 2008 at 9:43 pm

    :idea: hi poh

  3. carol..
    August 12th, 2008 at 4:55 am

    :grin:
    hi.. :)

    nice work..

    pinagaaralan nio ba css sa TIP?
    makapasok nga dun.. ehehe :D

  4. justin
    August 12th, 2008 at 3:37 am

    :oops: :idea: :grin: cge n turuan mo nman ako hehe…tnx

  5. khen
    August 10th, 2008 at 10:58 pm

    :idea: hi poh ate,

    pwd pohw b mg pgwa ng lheii-awt..

    un bng mka hide poh ing groups, fans. den nka centr poh lhat

    ang ung bakgroung pohw violet butterfly

    nlack ang lavender poh.. plz.. plz… enkz po sna mgawan u me.. :cry: :cool:

  6. maida
    August 10th, 2008 at 6:08 am

    grabe naman……
    nakaka..
    wala lang..
    parang nawalan ako ng malay sandali..
    hehe..
    salamat ha.

  7. quiin chronicah
    August 9th, 2008 at 7:45 pm

    :grin: ate ang galing moo !!!!!!!!!!

    kaso san buah ila2gay huh…?
    hhehehehehe :lol: :lol: :lol: :lol:

  8. topher
    August 3rd, 2008 at 11:25 pm

    :evil: :idea: :?: angaz nmn ha!!!!

  9. tet
    July 30th, 2008 at 6:41 am

    ate ..
    mwon pu b qau
    code pra i hide eung
    fiturd plendx , fan of and groups .. ?

    gustoh qu pu xe xea alixin ..
    pde pu b malaman .. ?

    by d way nga pu pla ..
    enkx fer d tutorial nkatulong tlgah xea .. !!
    tnx !! xoxo

  10. Jessa
    July 27th, 2008 at 11:05 pm

    :eek: :roll: parang dudugo ang ilong ko… :mrgreen: maybe i’m just tired, but thanks for the tutorials, i really appreciate your effort in posting this. Keep it up. :smile:


Leave a Reply