DesignMS - Grunge . Street

Designer's Comments

Look carefully for specific instructions

CSS / XHTML header.

Get more styles here: DesignMyspace.org (My just-for-fun project, whenever I've got time)

Direct link to theme: http://designmyspace.org/2008/09/series-2-urbanstreet/ (more instructions here, how to add stuff)

Hax :o
My myspace: http://myspace.com/alexanderagnarson Add me to friends (;

Using This Layout

For specific instructions read designer's comments

1. Log into myspace.com
2. Click on Edit Profile (Profile 1.0)
3. Copy (ctrl c) and paste (ctrl v) code to the specified fields

Layout Code

Copy and paste to About Me

Help

Layout Code

Copy and paste to I'd Like to Meet

Help

<a class="msg" href="http://yourmessagelinkgoeshere.com" title="Send Message"><span>Send Message</span></a>
<a class="friend" href="http://yourfriendlinkgoeshere.com" title="Add to friends"><span>Add to friends</span></a>

<a class="credit" href="http://designmyspace.org" title="Design by Alx"><span>Credit</span></a>

<div class="id2"><span class="color">08.</span>Your MySpace Title</div>
<div class="id3">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Integer adipiscing mollis augue. Pellentesque erat lectus, cursus sit amet, volutpat a, porta nec, dui. Ut ante orci, rutrum id, commodo vitae, rutrum ac, sem. Donec leo lacus, semper non, vulputate eu, gravida ut, turpis. Donec justo nisl, imperdiet et, suscipit id, ultrices a, turpis. Cras volutpat aliquam tellus. Pellentesque pede nulla.</div>  
<div class="id4">Lorem ipsum dolor sit amet, consectetuer adipiscing elit usiun.</div> 
<div class="id5">Photo Description here!</div> 
</div>

.masthead {width: 900px; height: 492px; position: absolute; margin-left: -450px; left: 50%; top: 169px; background-color:transparent; background-image: url(http://cbimg9.com/layouts/08/10/31862ac.jpg);}
body table {margin-top:510px;}
masthead .id1 {
	width: 432px;
	position: absolute;
	left: 440px;
	top: 396px;
	height: 81px;
	color:747474;
	padding: 0px;
	font-size: 11px;
	font-family: Arial, Verdana, Trebuchet MS, sans-serif;
	overflow: hidden;
}
.masthead .id2 {
	width: 374px;
	position: absolute;
	left: 119px;
	top: 122px;
	height: 40px;
	color:ffffff;
	padding: 0px;
	font-size: 30px;
	font-family: Arial, Verdana, Trebuchet MS, sans-serif;
	font-weight: bold;
	letter-spacing: -1px;
	overflow: hidden;
}
.masthead .id2 .color{
	color:222222;
	font-family: Arial, Verdana, Trebuchet MS, sans-serif;
}
.masthead .id3 {
	width: 648px;
	position: absolute;
	left: 192px;
	top: 368px;
	height: 66px;
	color:666666;
	padding: 0px;
	font-size:12px;
	font-family: Arial, Verdana, Trebuchet MS, sans-serif;
	overflow: hidden;
}
.masthead .id4 {
	width: 374px;
	position: absolute;
	left: 119px;
	top: 161px;
	color:CCCCCC;
	padding: 0px;
	font-size:12px;
	font-family: Arial, Verdana, Trebuchet MS, sans-serif;
	overflow: hidden;
}
.masthead .id5 {
	width: 305px;

position: absolute;
	left: 528px;
	top: 267px;
	color:505050;
	padding: 0px;
	font-size:12px;
	font-family: Arial, Verdana, Trebuchet MS, sans-serif;
	overflow: hidden;
}
.masthead .img1 {

width:315px;
	height: 210px;
	display:block;
	position: absolute;
	left: 518px;
	top: 42px;
	overflow: hidden;
}
.masthead .img2 {
	width:110px;
	height: 102px;
	display:block;
	position: absolute;
	left: 54px;
	top: 346px;
	overflow: hidden;
}
.masthead .credit {
	width: 86px;
	height: 14px;
	position: absolute;
	left: 758px;
	top: 12px;
	display: block;
	cursor: pointer;
}
.masthead .credit span {display: none;}

a img.noborder {border: 0;}
img.border {border-style:solid; border-width:3px; border-color:92908b; }
a img.border {border-style:solid; border-width:3px; border-color:92908b; }
a:hover img.border, a img.border:hover {border-style:solid; border-width:3px; border-color:c7c4bc;}

.masthead .friend {
  position: absolute;
  left: 39px;
  top: 287px;
  display: block;
  width: 100px;
  height: 25px;
  background-image: url(http://cbimg9.com/layouts/08/10/31862ad.jpg); background-repeat: no-repeat; background-position: 0 0;
}
.masthead .friend:hover {background-position: 0 -25px;}
.masthead .friend span {display: none;}

.masthead .msg {
  position: absolute;
  left: 148px;
  top: 287px;
  display: block;
  width: 100px;
  height: 25px;
  background-image: url(http://cbimg9.com/layouts/08/10/31862ae.jpg); background-repeat: no-repeat; background-position: 0 0;
}
.masthead .msg:hover {background-position: 0 -25px;}
.masthead .msg span {display: none;}

body {font-size: 1px; line-height: auto;background-color:ffffff; font-family: Arial, Verdana, Trebuchet MS, sans-serif; background-repeat: repeat-x; background-position: top center; background-image: url(http://cbimg9.com/layouts/08/10/31862af.jpg);}
p {margin: 0px 0px 1em 0px; font-family: font-family: Arial, Verdana, Trebuchet MS, sans-serif;}
a, a:link, a:visited {color:504c44; text-decoration: none; font-family: Arial, Verdana, Trebuchet MS, sans-serif;}
a:hover {color:726e64; text-decoration: none}
img {border: none; max-width: 425px !important;}
br {line-height: 20px;}
form {border-width:0px;background-color:none;}
body>div {margin-left: 10px;}
table, tr, td, table table, table table td {border-width:0px; background-color: transparent;}
table table table td {background-color:transparent;margin:0px;padding: 0 26px 15px 26px}
table table table table {border-width:0px;background-color:transparent;padding:0px;margin:0px; background-image: none;}
table table table table td {padding:0px;margin:0px;}
table table table {margin:0px; background-color:e5e2db; width: 100% !important; border-bottom: 3px; border-style:solid; border-color:c2beb5; background-repeat: no-repeat; background-position: top right; background-image: url(http://cbimg9.com/layouts/08/10/31862ag.jpg);}
body td table, body div table {margin-top: 0;}
font {color:726d60;font-size:10px; font-family: Arial, Verdana, Trebuchet MS, sans-serif;}
a font:hover {color:504c44}
a.navbar:link, a.navbar:visited {color:504c44}
a.navbar:hover {color:726e64}
table tr td table tr td font {display: inline;}
table tr td table a.navbar {font-size: 10px;}
.text {color:726d60;font-size:11px; font-family: Verdana, Arial, Trebuchet MS, sans-serif;}
a.text:link, a.text:visited {color:504c44}
a.text:hover {color:726e64}
.nametext {color:ba2829; font-size: 16px; margin: 14px 0px 4px 0px; padding: 0px 0px 3px 0px; text-align: center; display: block; font-family: Arial, Verdana, Trebuchet MS, sans-serif; font-weight: bold; border-width: 0px 0px 3px 0px; border-style: double; border-color: c9c7c1; width: 280px !important; vertical-align: bottom;}
NOTE {If you want to use an image for your name, use the following code}
.nametextREMOVE {background-image: url(http://cbimg9.com/layouts/08/10/31862ah.gif); background-position: bottom center; background-repeat: no-repeat; overflow: hidden; height: 40px; width: 100%; font-size: 1px; text-align: left; color: 38332f; padding: 0px 0px 3px 0px; display: block; margin: 14px 0px 8px 0px; border-width: 0px 0px 3px 0px; border-style: double; border-color: c9c7c1;}
.contactTable {width: 332px !important;}
.contactTable td {padding: 0px; margin: 0px; text-align: center;}
.contactTable span.whitetext12 {position: relative; left: 24px;}
.contactTable td table {background-color: transparent; background-image: url(http://cbimg9.com/layouts/08/10/31862ai.jpg); background-position: center; background-repeat: no-repeat;}
.contactTable a {padding: 0px; margin: 0px 0px 1px 5px; display: block; height: 30px; width: 156px; background-color: transparent;}
.contactTable a img, .contactTable img {border: 0px; display: none; visibility: hidden;}
table tr td table tr td table tr td div strong {display: block; width: 280px; font-family: Arial, Verdana, Trebuchet MS, sans-serif;}
.whitetext12 {color:ba2829; font-size: 12px; margin: 0px 0px 4px 0px; padding: 5px 0px 7px 0px; text-align: center; display: block; font-family: Arial, Verdana, Trebuchet MS, sans-serif; font-weight: bold; border-width: 0px 0px 3px 0px; border-style: double; border-color: c9c7c1; width: 280px}
.blacktext12 {color:ba2829;font-size: 12px; font-family: Arial, Verdana, Trebuchet MS, sans-serif; font-weight: bold; display: block; margin-top: 14px; width: 100%;}
.contactTable span.whitetext12 {position: relative; left: 24px;}
.btext {color:ba2829; font-size: 12px; margin: 14px 0px 4px 0px; padding: 0 14px 14px 14px; text-align: center; display: block; font-family: Arial, Verdana, Trebuchet MS, sans-serif; font-weight: bold; border-width: 0px 0px 3px 0px; border-style: double; border-color: c9c7c1; width:370;}
.orangetext15 {color:ba2829; font-size: 12px; margin: 14px 0px 4px 0px; padding: 0 14px 14px 14px; text-align: center; display: block; font-family: Arial, Verdana, Trebuchet MS, sans-serif; font-weight: bold; border-width: 0px 0px 3px 0px; border-style: double; border-color: c9c7c1; width:370px;}
.lightbluetext8 {color:666666;}
.redtext,.redbtext {color:ba2829; font-family: Arial, Verdana, Trebuchet MS, sans-serif; font-size: 12px; font-weight: bold;}
a.redlink:link {color:504c44; display: block; text-align: center; border-width: 3px 0px 0px 0px; border-style: double; border-color: c9c7c1; padding-top: 3px;}
a.redlink:visited {color:504c44}
a.redlink:hover {color:726e64}
u {text-decoration: none; font-size: 10px;}
a.searchlinkSmall, a.searchlinkSmall:link, a.searchlinkSmall:visited { color:726d60; }
a.searchlinkSmall:hover { color:fefefe; }
td, table, tr, span, li, p, div, textarea, DIV {color:726d60;} 
h1, h2, h3, h4, h5, h6 {color:ba2829;} 
.blacktext10 {color:ba2829 !important; font-size: 11px!important;}
.searchlinksmall a{color:ba2829 !important;}
.searchlinksmall a:hover{color:ba2829 !important; text-decoration: underline !important;}
.userProfileURL {font-size: 9px!important;}
</style>

Layout Comments

Showing latest 10 of 19 comments

awww, thank you very much for this layout! I saw this one as Kristen Stewart's profile and now I make it my one! thanks, I'm waiting for your new amazing layouts!

By juliakokosha on Apr 3, 2009 1:56 pm

great job! love it!

By calilani on Mar 23, 2009 12:19 am

Very creative. I love it. :D

By Mikeplyts on Feb 8, 2009 6:22 am

I love the colors and the 'send message' and 'add' links at the top right under the banner. I love everything about this layout you did an amazing job!

By dilligrout on Oct 11, 2008 10:49 pm