Example 5: Add an image with text to the Contact section of
your MySpace Profile Page



As in Example 4, for the examples shown on this page I will add various background images to the My Contact section. The difference is for the images in Example 5 I have added text to the image. By using this image with text and the code below I will overlay the image map that MySpace uses in the Contact Section.



Again, as I stated in Example 4:

Go to If you want to use any other images that I use as backgrounds for the Contact section.

These background images are all size 300x200 pixels. I have seen MySpace pages where the Contact section images are 300x150 pixels. If you use other than 300x200 pixel size images then change the code:

	 .contactTable { width:300px !important; height:200px !important ....
     






Below is code I added to mySpace profile and a screen shot of the actual mySpace profile page:


<gwl code="layout">
<style type="text/css">
.code { GreatWebLayouts}
</style>

<style type="text/css">

	body {
	border:2px dashed ffffff; background:FFFFFF 
	url('http://s113.photobucket.com/albums/n210/gwldn/Jewel_Tone_2/JT2_Fire_Opal_1024x1024.jpg') 
	no-repeat fixed center 50%; 
	}       

table, tr, td { background-color:transparent; border:none; border-width:0;} 

.contactTable { width:300px !important; height:200px !important; 
background-image:url("http://s113.photobucket.com/albums/n210/gwldn/My
Space_Contact_300x200/Spiderwort_w_text_300x200.jpg"); 

background-attachment:scroll; background-position:center center; background-repeat:no-repeat; 
background-color:transparent;} 

.contactTable table, table.contactTable td {padding:0px !important; border:0px; 
background-color:transparent; background-image:none;} 

.contactTable a img {visibility:hidden; border:0px!important;} 

.contactTable a {display:block; height:28px; width:115px;} 

.contactTable .text {font-size:1px!important;}

.contactTable .text, .contactTable a, .contactTable img {filter:none!important;}


</style>
</gwl code="layout">


Example 1 screen shot I used our Spiderwort_w_text_300x200.jpg image:

Example 5 screen shot 1



Example 2 screen shot using our horse_003_w_text_300x200.jpg image:

Example 5 screen shot 2




There is a down side of entering the code below, which hides the blue text that MySpace provides in the Contact Section of a profile.

.contactTable a img {visibility:hidden; border:0px!important;} 
If your image isn't available then the Contact Section of your profile page will look like it is blanked out. Such as:

Example 5 screen shot 3
But actually all your Contact links to your Send Messages, Favorites, and so on are still there, they are just hidden.

In a browser window, run your mouse over that 'blank' Contact Section and watch the status bar at the bottom (in an IE browser) show you the various URLs that are listed in the Contact Section.






In Example 6 I will provide you with a step-by-step discussion of taking one of your own images and adding it as a background image with text to the My Contact section.

If you want to receive an email when I add more help text, then click the Subscribe button on the home page of www.GreatWebLayouts.com.