Converting Options

[dyindyinjohnson]

I've been wanting to convert my DIV layouts to 2.0.
How would I do that?
I know you need to separate the HTML from the CSS.

CODE

<p><a href="http://www.createblog.com/myspace-layouts/" title="Grab Myspace Layouts and Myspace Codes"><img src="http://www.createblog.com/images/link1.gif" border="0" alt="Myspace Layouts" style="position:absolute;top:0px;left:0px;width:10px;height:27px;" /></a></p><style>


.image {position:absolute; left:50%; margin-left:-470px;
top:100px;}

.links {position:absolute;top:730px; left:50%; margin-left:-420px; width:900px;}

.content {position:absolute; top:536px; left:50%; margin-left:110px;
overflow:auto; width:250px; height:180px; color:000000; font-size:10px;
margin-top:1px;font-weight:normal; letter-spacing:1px; font-family:tahoma;}
</style>


<style type="text/css">
div, table, tr, td, tbody {background-color:transparent;}

a.home{
float:left;
height: 90px;
width: 105px;
overflow: hidden;
background-image: url("http://cbimg6.com/layouts/09/11/35975ab.png");
background-position: center;
background-repeat: no-repeat;
}

a.home:hover{
background-image: url("http://cbimg6.com/layouts/09/11/35975ac.png");
background-position:center;
background-repeat: no-repeat;
}

a.message{
float:left;
height: 90px;
width: 174px;
overflow: hidden;
background-image: url("http://cbimg6.com/layouts/09/11/35975ad.png");
background-position: center;
background-repeat: no-repeat;
}

a.message:hover{
background-image: url("http://cbimg6.com/layouts/09/11/35975ae.png");
background-position:center;
background-repeat: no-repeat;
}

a.comment{
float:left;
height: 90px;
width: 178px;
overflow: hidden;
background-image: url("http://cbimg6.com/layouts/09/11/35975af.png");
background-position: center;
background-repeat: no-repeat;
}

a.comment:hover{
background-image: url("http://cbimg6.com/layouts/09/11/35975ag.png");
background-position:center;
background-repeat: no-repeat;
}

a.pictures{
float:left;
height:90px;
width:176px;
overflow: hidden;
background-image: url("http://cbimg6.com/layouts/09/11/35975ah.png");
background-position:center;
background-repeat: no-repeat;
}

a.pictures:hover{
background-image: url("http://cbimg6.com/layouts/09/11/35975ai.png");
background-position:center;
background-repeat: no-repeat;
}

a.add{
float:left;
height:90px;
width:72px;
overflow: hidden;
background-image: url("http://cbimg6.com/layouts/09/11/35975aj.png");
background-position:center;
background-repeat: no-repeat;
}

a.add:hover{
background-image: url("http://cbimg6.com/layouts/09/11/35975ak.png");
background-position:center;
background-repeat: no-repeat;
}

a.block{
float:left;
height:90px;
width:130px;
overflow: hidden;
background-image: url("http://cbimg6.com/layouts/09/11/35975al.png");
background-position:center;
background-repeat: no-repeat;
}

a.block:hover{
background-image: url("http://cbimg6.com/layouts/09/11/35975am.png");
background-position:center;
background-repeat: no-repeat;
}
</style>


<div class="links">
<a href="http://home.myspace.com/index.cfm?fuseaction=user" class="home"></a>
<a href="http://messaging.myspace.com/index.cfm?fuseaction=mail.message&friendID=XXXXXXXX" class="message"></a>
<a href="http://comment.myspace.com/index.cfm?fuseaction=user.viewProfile_commentForm&friendID=
XXXXXXXX&MyToken=8b2108be-2301-4485-a399-e782c86fa854" class="comment"></a>
<a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=XXXXXXXX" class="pictures"></a>
<a href="http://friends.myspace.com/index.cfm?fuseaction=invite.addfriend_confirm&statusCD=1&friendId=XXXXXXXX" class="add"></a>
<a href="http://friends.myspace.com/index.cfm?fuseaction=block.blockuser&userID=XXXXXXXX" class="block"></a>
</div>


<div class="image">
<img src="http://cbimg6.com/layouts/09/11/35975aa.png" width="864" border="0" usemap="#imap_36" >
<map id="imap_36" name="imap_36" >
<area shape="rect" coords="102,316,117,451" alt="" title="" href="http://www.myspace.com/dyindyinjohnson">
</map>
</div>

<div class="content">
<center>
Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here.
</center>
</div>
<style>
{Background Properties}
table, tr, td { background-color:86806a;
border:none; border-width:0;}
body {background-color:86806a}
.mygen { Table Properties }
table table { border: 0px }
table table table table{border:0px}
table table table {
background-color:86806a;}

.mygen { Text Properties }
table, div{font-family:arial; color:FFFFFF; font-size:12px;}
</style>
<style>
.profileInfo, .contactTable, .userProfileURL, .interestsAndDetails,
.userProfileDetail, .userProfileNetworking, .userProfileSchool,
.userProfileCompany, .extendedNetwork, .latestBlogEntry,
.blurbs td.text, .orangetext15, table div { display:none!important;
}div table div, table table div {
display:block!important; padding:0;
}table, tr, td {
background:none; border:none;
}.clearfix, .clearfix div {
background-image:none!important;
overflow:hidden;
}.clearfix {
position:relative;
top:-30px;
width:728px;
}.clearfix .clearfix {
bottom:-30px;
margin:-45px 0 0;
position:relative;
top:auto;
width:auto;
}.clearfix .clearfix div {
margin:45px 0 0;
}.clearfix .clearfix div div {
margin:auto;
}.profile, .profile div, .profile input, .clearfix select,.clearfix option, .clearfix ul {
display:none!important;
filter:alpha(opacity=0);
-moz-opacity:0;
opacity:0;
}.friendSpace {display:none;}.friendsComments {display:none;}.contactTable {display: none;}.extendedNetwork {display:none;}.latestBlogEntry {display:none;}.userProfileURL {display:none;}.userProfileDetail {display:none;}
</style>

That is just one layout I want to convert.
Thanks!

[dyindyinjohnson]

I am having a lot of trouble with this, like the layout is not turning out or anything, and because some of my layouts are linked using image mapping, I can't click links.

CODE

<p><a href="http://www.createblog.com/myspace-layouts/" title="Grab Myspace Layouts and Myspace Codes"><img src="http://www.createblog.com/images/link1.gif" border="0" alt="Myspace Layouts" style="position:absolute;top:0px;left:0px;width:10px;height:27px;" /></a></p><style>
.image {position:absolute; left:50%; margin-left:-550px;
top:100px;}

.content {position:absolute; top:195px; left:50%; margin-left:-35px;
overflow:auto; width:335px; height:390px; color:000000; font-size:10px;
margin-top:1px;font-weight:normal; letter-spacing:1px; font-family:tahoma;}
</style>


<div class="image">
<img src="http://cbimg6.com/layouts/09/07/35152aa.jpg" width="1080" border="0" usemap="#imap_21" >
<map id="imap_21" name="imap_21" >
<area shape="rect" coords="200,248,230,278" alt="" title="" href="http://home.myspace.com/index.cfm?fuseaction=user">
<area shape="rect" coords="240,230,304,252" alt="" title="" href="http://messaging.myspace.com/index.cfm?fuseaction=mail.messageV2&friendID=XXXXXXXX&MyToken=8b2108be-2301-4485-a399-e782c86fa854">
<area shape="rect" coords="312,248,335,313" alt="" title="" href="http://comment.myspace.com/index.cfm?fuseaction=user.viewProfile_commentForm&friendID=XXXXXXXX&MyToken=8b2108be-2301-4485-a399-e782c86fa854">
<area shape="rect" coords="333,324,352,388" alt="" title="" href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums2&friendID=XXXXXXXX&view=true" target="_self">
<area shape="rect" coords="339,400,358,433" alt="" title="" href="http://friends.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=XXXXXXXX" target="_self">
<area shape="rect" coords="342,443,359,479" alt="" title="" href="http://friends.myspace.com/index.cfm?fuseaction=block.blockuser&userID=XXXXXXXX" target="_self">
<area shape="rect" coords="791,500,862,518" alt="" title="" href="http://www.myspace.com/dyindyinjohnson">
</map>
</div>

<div class="content">
<center>
Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here. Content Here.
</center>
</div>


<style>
{Background Properties}
table, tr, td { background-color:#FFF;
border:none; border-width:0;}
body {background-color:#FFF}
.mygen { Table Properties }
table table { border: 0px }
table table table table{border:0px}
table table table {
background-color:#FFF;}

.mygen { Text Properties }
table, div{font-family:arial; color:FFFFFF; font-size:12px;}
</style>
<style>
.profileInfo, .contactTable, .userProfileURL, .interestsAndDetails,
.userProfileDetail, .userProfileNetworking, .userProfileSchool,
.userProfileCompany, .extendedNetwork, .latestBlogEntry,
.blurbs td.text, .orangetext15, table div { display:none!important;
}div table div, table table div {
display:block!important; padding:0;
}table, tr, td {
background:none; border:none;
}.clearfix, .clearfix div {
background-image:none!important;
overflow:hidden;
}.clearfix {
position:relative;
top:-30px;
width:728px;
}.clearfix .clearfix {
bottom:-30px;
margin:-45px 0 0;
position:relative;
top:auto;
width:auto;
}.clearfix .clearfix div {
margin:45px 0 0;
}.clearfix .clearfix div div {
margin:auto;
}.profile, .profile div, .profile input, .clearfix select,.clearfix option, .clearfix ul {
display:none!important;
filter:alpha(opacity=0);
-moz-opacity:0;
opacity:0;
}.friendSpace {display:none;}.friendsComments {display:none;}.contactTable {display: none;}.extendedNetwork {display:none;}.latestBlogEntry {display:none;}.userProfileURL {display:none;}.userProfileDetail {display:none;}
</style>

[Mickey]

I am having a lot of trouble with this, like the layout is not turning out or anything, and because some of my layouts are linked using image mapping, I can't click links.

Like Elia posted on that converter page, "Profile 2.0 does not support image maps. Image maps are removed during conversion."