BrotherGary is Proud to make available to Everyone on SingSnap

BrotherGary's Custom CSS Styles
The codes on this page are:
For Your Recordings
Do NOT use these codes on Profiles
Click this link for Profile pages:
Styles for Profiles


This design uses default fonts "Trebuchet MS", Helvetica, Verdana, "Arial Narrow" & sans-serif
Both Headers & Footers have been removed to make your pages look much nicer & more personal
so if you decide to include your own background image & banner, it will look really nice.
(Even if you choose a totally white background, the comment & rating boxes will look really sharp with no background)
Other cool features include: The removal of that ugly blue word GOLD next to all Gold Member's Names.
Gold member's "Away Messages" will no longer be seen on your recordings.

All color combinations on THIS page includes BrotherGary's Special Unique Feature
Designed Specifically for your Recording pages.
This Special Unique Feature eliminates the row of Sub Menu links
BrotherGary doesn't believe that these links are neccessary on the Recordings Pages.
(They can be found on Any Other SingSnap page and they have nothing to do with any of OUR Personal Pages)
The background colors on playlist banner is now transparent, to blend-in nicely with your page design

(when Gold members are viewing your recordings on a playlist)
New! CSS code has been added which will allow you to Add a Border on ANY individual page
(Borders will be solid, the same color as the text, and can range from 1px to 20px)
New! CSS code has been added which will place your Comment Box in a Fixed Position
(This allows for commenting at any point on the page as your fans scroll and read other's comments)
(Comment Box Placement is not supported with IE 6.0 browsers or older)

Instructions on How to Add Your Own Image Banner at the Top of any of your pages
New! Instructions on How to Add Your Own Text Banner at the Top of any of your pages
Instructions on How to Add a Border on any of your pages (up to 20px)

Warning!!
Some folks on SingSnap are trying to blame these CSS Styles for causing browsing troubles for them
when they view recordings which are using these css styles
This is a flat-out LIE and the only possible way anyone is having browser troubles
is if YOU are using some other codes on your own recordings, which was designed for sites such as MySpace
A LOT of folks have NO clue about the codes they are grabbing from those Lay-Out web sites.
Those codes are created for a FULL Lay-Out design, NOT just for adding a Background to your page.
So if all you are wanting to add to your page is a Pretty Background (with My CSS Styles)
then make absolutely certain you use a Simple Background Code for the Background image you want
Do NOT use a Full Lay-out design code, only to get a Background Image on your recording
If you get any complaints about any of your recordings that are using my CSS Styles
Simply contact ME
I will view your page source and determine if there are any other codes on your page causing the trouble
And I will send you a simple code to use for your chosen background image
*****************************************************


Now Enjoy these CSS Styles
Simply pick the Color Combinations on this page and add the code to your Recording's Information Box

For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



For This Color Text
on the Background you see
Use the Code Below

Use the code Below for the Colors Above



Total Count = 82 (last updated 11/12/2008)

NOTE: Changing the numbers on these codes, will NOT change the colors for you
If you attempt to change the numbers on these codes, it simply won't work for you

Continue Checking Back for More Color Combinations

Want a Specific Color Combination? Contact Me on SingSnap & Tell Me what YOU Want
(Use This Page to Pick Your Colors and simply provide me with the HEX Numbers for Text & Background Colors)
Click Here to send me a Private Message on SingSnap


Would you consider making a small donation to BrotherGary?
I have recently learned that several members on SingSnap are charging as much as $75.00 to create a style sheet for other members
While this is all Fine & Dandy for some folks, there are many others who simply can not afford this
This Project, as with ALL of my Help projects, is founded on LOVE to help those who simply can not afford it
(Your donations allow me to invest more time into my Help projects so Everyone can Benefit for FREE)
Click Here for several of my other Help Projects


to BrotherGary
for his time spent helping others
(helps cover the cost of web site expenses etc.)
for his Prison Love Ministry expences
(stamps, envelopes, ink, printing paper, postage etc.)








To Mail Donations:

Gary Gideon
2322 Nicholson Avenue
Cincinnati, Ohio 45211-6117


For those of you who are unable to make a small donation
Here is another way you could show your appreciation for using the Styles I create for You
Challenge For All Stars is in Need for New Hosts to host our Daily Challenges on SingSnap
It would sure be a Big Help if you would be willing to Host A Challenge for us once in a while
Simply Click this Link to see how easy it is: How to Host a Challenge

If you can not host, please at least stop in each day and share some of your recordings with us
We have a New Theme Daily
The only requirement is: For Each Song You Post, Please Listen & Comment on 3 Others
Challenge For All Stars Home Page


Any questions? Contact BrotherGary on SingSnap
Click Here to send me a Private Message on SingSnap



Adding an Image Banner to Your Recordings pages
When creating your banners, the heigth must NOT exceed 83px
The ideal size for your Recording Banners is 740 x 80
otherwise, your banner will overlap the links on your sub-menu


Here is a really cool code that will place your banner perfectly in the Top-Center of your Recordings Page


(Do NOT remove the Quotes & do NOT include anything other than the Direct Path)
A Direct Path looks like this: http://challengeforallstars.com/albums/BrotherGary/images/JesusIsLord-Banner-80.gif

It it very important to include the Width & Heigth of your banner
If for any reason that your banner is not centered perfectly, increasing the -365px will move your banner to the left
(Please Note that it is a negative number. Changing it to -465px would move it to the left)


This is the size that your banner should be


Increasing top: 0px to top: 10px will move your banner down 10 pixels, but then your banner will over-lap the links
To avoid this, you could create your banner at a smaller height (83px is the maximum height)

You can also add a Side-Image to your banner, by duplicating the banner code and changing the values
I decided to add a side image to the left-side of the above banner.
But since the above banner was much wider than I needed it to be, I cropped it to 640 x 80 instead of 740 x 80


I then changed the values in my banner code to the following: margin-left:-300px; and width="640" I used the code below for the banner.
This positioned my banner to exactly where I wanted it to be, leaving room for a banner side-image

Such As This! This image is 104 x 110

I used the code below for the my banner's side-image
To get it positioned where I wanted it, I played with the values in that code to the following:
margin-left:-385px; and width="104" and height="110"
Please Note: Whichever image code is pasted 2nd, That image will be On Top of the 1st image pasted.
(incase your images need to over lap one another)

You can now see the results on My Recording below
I Can Only Imagine

Please Note: These instructions are ONLY for Recordings Page Banners, used in combination with the codes on this page
Banners for your Profiles can use different dimensions
This will be explained more thoroughly on the Profiles Style Sheet Codes page



Add a Border to Any Page
Borders can range anywhere from 1px up to 20px

Use this Simple Code in your Information Box to Add a Border
(this example will add a border 7px thick)

Simply change the number 7, to determine the thickness of the border you desire to have (up to 20)
(This code only works if used in combination with BrotherGary's CSS Styles found on this page)



Adding a Text Banner to Your Recording pages
Here is a New code I developed where you can add a Text Banner
It places an invisible table (800 x 60) at the Top Center
You can choose your own Font, Font Size, and Font Color
Simply replace Jesus Christ is My Lord with your own text


Unfortunately, IE browsers have some sort of limit on increasing the font size too much
However, by enclosing <big>Jesus Christ is My Lord</big> with the <big></big> tags, it still increases the Font size on Firefox
I am satisfied using this code on both IE & Firefox for this recording:
http://www.singsnap.com/snap/r/b7c5cebb



Please note the very 1st <br> in the code before <font face="edwardian script itc" color="#E9967A" size="96px">
This <br> is important to be placed there, otherwise Large Fonts will get cut off at the top
The last 2 <br>'s in the code drops the table height down, so the Font fits and is not cut off at the bottom
Depending on your chosen font & Font Size, the number of <br>'s after your text can vary
But be careful not to allow your table to drop down too far & over-lap the SS links
Otherwise, the links will not be clickable to your viewing friends
If you want, you can change the border="0" to border="1" while you are testing your measurements
This will allow you to see a border around the invisible table

PLEASE NOTE: If you are NOT using one of my CSS Styles, you will need to use this code instead

Added background-color: rgb(130, 130, 130); to the code
This will add a background color to the table, to cover the SS Beta Logo & that large gold Subscribe To SingSnap banner that the blue members see
Here is an example on one of my recordings where I am not using one of my CSS Styles
http://www.singsnap.com/snap/r/abb8dac3 (includes the table border)
To change the table's background color, simply change the rgb numbers in the code: rgb(130, 130, 130)


Would you consider making a small donation to BrotherGary?
I have recently learned that several members on SingSnap are charging as much as $75.00 to create a style sheet for other members
While this is all Fine & Dandy for some folks, there are many others who simply can not afford this
This Project, as with ALL of my Help projects, is founded on LOVE to help those who simply can not afford it
(Your donations allow me to invest more time into my Help projects so Everyone can Benefit for FREE)
Click Here for several of my other Help Projects


to BrotherGary
for his time spent helping others
(helps cover the cost of web site expenses etc.)
for his Prison Love Ministry expences
(stamps, envelopes, ink, printing paper, postage etc.)








To Mail Donations:

Gary Gideon
2322 Nicholson Avenue
Cincinnati, Ohio 45211-6117


Any questions? Contact BrotherGary on SingSnap
Click Here to send me a Private Message on SingSnap


Adding Backgrounds
Return to Top of Page