how do i instert text boxes and get things in layers in my new div Options

[ukrides]

I want to have some text boxes and i would like to have some image rollovers in my new div layout but i insert codes but they don't show up on myspace is there a way to make them into like layers /orders I've heard of z-index but its not working so don't no what to do
heres my myspace
heres my code that in my about me section

CODE

<style>embed, object {width:0px; height:0px;} table table table embed, table table table object {width:320px; height:240px;} </style></a>

<div class="navigation" style="position: absolute; left:200px; top:90px;z-index:0 ">

<img src="http://i34.tinypic.com/9iwn0n.jpg" width="1024" height="768" border="0" alt="" usemap="#myspace_Map" />

<map name="myspace_Map">

<area shape="rect" alt="" coords="787,730,1023,767" href="http://www.msplinks.com/MDFodHRwOi8vd3d3Lm15c3BhY2UuY29tL3VrcmlkZXM=" />

<area shape="rect" alt="" coords="606,708,741,752" href="http://www.msplinks.com/MDFodHRwOi8vaG9tZS5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2Vy" />

<area shape="rect" alt="" coords="384,708,592,752" href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVz
2FnZSZmcmllbmRJRD0xMDIxNTg0NzcmTXlUb2tlbj00MTMwZTZiZC0yYTFlLTQzZWQtODliNS03MTgyN
JmN2Q2ZjA=" />

<area shape="rect" alt="" coords="217,708,336,752" href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJRD0xMDIxNTg0Nzc=" />

<area shape="rect" alt="" coords="39,708,142,753" href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIu
mlld0FsYnVtcyZmcmllbmRJRD0xMDIxNTg0Nzc=" />

</map>
</div>






<div class="content" style="position: absolute;
left:000px;
top:000px;
z-index:1 ">
width:000px;
height:000px;
overflow: auto;

}
><center>
<a class="></a>
<style>
a.NAME
{float:left;background:url(http://i36.tinypic.com/2vvndyu.gif)repeat;width:175px;height:129px;position:absolute; top:0px; left:0px;display:block;}
a.NAME:hover
{float:left;background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>
</div>
<style>
.mslogo, .clearfix form, .clearfix a, .clearfix select, .profileinfo, .contacttable, .userprofileurl, .interestsanddetails, .userprofiledetail, .userprofilenetworking, .userprofileschool, .userprofilecompany, .extendednetwork, .latestblogentry, .blurbs td.text, .orangetext15, .friendspace, .friendscomments, table div {display:none!important;}
table table div, .clearfix, .clearfix div {display:block!important;}
table, tr, td, .clearfix {background:none!important;}
.clearfix tr td div {filter:alpha(opacity:0)!important;}
.bodycontent div {_filter:alpha(opacity:100)!important;}
div[id="></style>


<style>
.mslogo, .clearfix form, .clearfix a, .clearfix select, .profileinfo, .contacttable, .userprofileurl, .interestsanddetails, .userprofiledetail, .userprofilenetworking, .userprofileschool, .userprofilecompany, .extendednetwork, .latestblogentry, .blurbs td.text, .orangetext15, .friendspace, .friendscomments, table div {display:none!important;}
table table div, .clearfix, .clearfix div {display:block!important;}
table, tr, td, .clearfix {background:none!important;}
.clearfix tr td div {filter:alpha(opacity:0)!important;}
.bodycontent div {_filter:alpha(opacity:100)!important;}
div[id="topnav"], div[id="shortcuts"] {opacity:0!important;}
</style>

thanks ukrides

Reason for edit: please put codes in codeboxes. thanks :) -natalia

[Mickey]

Try not to post several topics about the same problems. You've been posting topics about z-index issues and I've been trying to answer them but you don't even read my replies.

Your DIV codes are all messed up. You have this for your content:

CODE

<div class="content" style="position: absolute; left:000px;
top:000px;
z-index:1 ">
width:000px;
height:000px;
overflow: auto;

}
><center>
<a class="></a>
<style>
a.NAME
{float:left; background:url(http://i36.tinypic.com/2vvndyu.gif)repeat; width:175px; height:129px; position:absolute; top:0px; left:0px; display:block;}
a.NAME:hover
{float:left; background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>
</div>

DIV codes are supposed to be separate from CSS codes. So it should look like this:

CODE

<div class="content" style="position: absolute;
left:000px; top:000px; z-index:1 width:000px; height:000px; overflow: auto;"><center>
<a class="></a>
</div>

<style>
a.NAME
{float:left; background:url(http://i36.tinypic.com/2vvndyu.gif)repeat; width:175px; height:129px; position:absolute; top:0px; left:0px;display:block;}
a.NAME:hover
{float:left; background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>

Then you just go on from there. You need to change 000px where it says left: and top: so you can move your div scrollbox to where you want it to be. You also need to change 000px where it says height: and width: so you'll have space for your content.

[ukrides]

Try not to post several topics about the same problems. You've been posting topics about z-index issues and I've been trying to answer them but you don't even read my replies.

Your DIV codes are all messed up. You have this for your content:

CODE

<div class="content" style="position: absolute; left:000px;
top:000px;
z-index:1 ">
width:000px;
height:000px;
overflow: auto;

}
><center>
<a class="></a>
<style>
a.NAME
{float:left; background:url(http://i36.tinypic.com/2vvndyu.gif)repeat; width:175px; height:129px; position:absolute; top:0px; left:0px; display:block;}
a.NAME:hover
{float:left; background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>
</div>

DIV codes are supposed to be separate from CSS codes. So it should look like this:

CODE

<div class="content" style="position: absolute;
left:000px; top:000px; z-index:1 width:000px; height:000px; overflow: auto;"><center>
<a class="></a>
</div>

<style>
a.NAME
{float:left; background:url(http://i36.tinypic.com/2vvndyu.gif)repeat; width:175px; height:129px; position:absolute; top:0px; left:0px;display:block;}
a.NAME:hover
{float:left; background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>

Then you just go on from there. You need to change 000px where it says left: and top: so you can move your div scrollbox to where you want it to be. You also need to change 000px where it says height: and width: so you'll have space for your content.

thanks i am very sorry for posting it so much but i was just getting annoyed i will nto do this in the future

thanks again ukrides

[ukrides]

if i had my code like this

CODE

<div class="content" style="position: absolute;
left:000px; top:000px; z-index:1 width:000px; height:000px; overflow: auto;"><center>
<a class="></a>
</div>

<style>
a.NAME
{float:left; background:url(http://i36.tinypic.com/2vvndyu.gif)repeat; width:175px; height:129px; position:absolute; top:0px; left:0px;display:block;}
a.NAME:hover
{float:left; background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>

wouldnt that meen the div wouldnt be doin anything because i thoguht it was supposed to be rapped around the code you wanted there

[Mickey]

Technically, yes. But the codes you put inside the DIV tags are CSS codes. They're not meant to be put inside DIVs. What you put inside DIVs are HTML codes, which is what's bolded:

CODE

<div class="content" style="position: absolute;
left:000px; top:000px; z-index:1 width:000px; height:000px; overflow: auto;"><center>
<a class="></a>
</div>

<style>
a.NAME
{float:left; background:url(http://i36.tinypic.com/2vvndyu.gif)repeat; width:175px; height:129px; position:absolute; top:0px; left:0px;display:block;}
a.NAME:hover
{float:left; background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>

If you wanted to put something else inside that specific DIV, just replace the bolded text with what you want.

[ukrides]

Technically, yes. But the codes you put inside the DIV tags are CSS codes. They're not meant to be put inside DIVs. What you put inside DIVs are HTML codes, which is what's bolded:

CODE

<div class="content" style="position: absolute;
left:000px; top:000px; z-index:1 width:000px; height:000px; overflow: auto;"><center>
<a class="></a>
</div>

<style>
a.NAME
{float:left; background:url(http://i36.tinypic.com/2vvndyu.gif)repeat; width:175px; height:129px; position:absolute; top:0px; left:0px;display:block;}
a.NAME:hover
{float:left; background:url(http://i33.tinypic.com/vqp1e0.jpg)repeat;}
</style>

If you wanted to put something else inside that specific DIV, just replace the bolded text with what you want.

how would i have layers with css or is there another way to have a rollover image and comment boxes with html instead of css and alos thanks youve been great and im very thankful for your help :)

[Mickey]

I'm not sure about rollover images using HTML. And aren't comment box codes made using HTML already? If you wanted layers, as in more div scrollboxes, just repeat this code:

CODE

<div class="content" style="position: absolute;
left:000px; top:000px; z-index:1 width:000px; height:000px; overflow: auto;"><center>
<a class="></a>
</div>

You need to change the content, which is the bold text. You also need to change the left margin, the top margin, the height, and the width to your liking. By the way, it's no problem. You're welcome.

[ukrides]

I'm not sure about rollover images using HTML. And aren't comment box codes made using HTML already? If you wanted layers, as in more div scrollboxes, just repeat this code:

CODE

<div class="content" style="position: absolute;
left:000px; top:000px; z-index:1 width:000px; height:000px; overflow: auto;"><center>
<a class="></a>
</div>

You need to change the content, which is the bold text. You also need to change the left margin, the top margin, the height, and the width to your liking. By the way, it's no problem. You're welcome.

il look roudn the net to see if u can do rollover with html i hope u can so i can have a interactive kidna myspace and release it here :)

[manny-the-dino]

Due to this topic being 2 weeks old & the problem being solved, this topic is Closed & Moved. PM me if you'd like for me to open this.