Music Player is behind my DIV..Please Help., yup. you read it right. Options

[shutterleftopen]

Click Here to view Test Page


The above link is to a test page of mine that i'm working on. The music player isn't showing in front of the div that i have. i have never done any layouts like this with the music player in the custom spot. Please let me know what i need to do to fix this. Thanks in Advance.


Body Code Placed in the "bio" section:

CODE

<style>
.profileWidth table { margin-bottom:2410px; width:800px; }
.rail { display:none; }
.gap {
background:url() top left no-repeat;
width:800px; height:2410px;
position:absolute; top:0; left:50%;
margin:0px -400px -2198px;
</style>


<div class="gap"></div>


<style type="text/css">
.masthead {position:absolute; top:175px; margin-left:-400px; left:50%; width:800px; height:2124px; z-index:2;}
table div.slide {display:block; visibility:visible;}
table div.layout {display:block; visibility:visible;}
table div.myBio {display:block; visibility:visible;}
table div.video {display:block; visibility:visible;}
</style>


<div class="masthead">



<img src=" http://aspect-photos.com/ratedr/ratedr-overlay-jpg.jpg" /><a href="ADD FRIEND" style="position:absolute; top:710px; left:100px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:120px;" /></a><a href="MESSAGE US!!!!" style="position:absolute; top:830px; left:40px;">
<img src="http://x.myspace.com/images/clear.gif" style="width:190px; height:90px;" /></a><a href="WEBSITE!!!!!!!" style="position:absolute; top:800px; left:270px;"><img src="http://x.myspace.com/images/clear.gif" style="width:530px; height:200px;" /></a><a href="VIEW PHOTOS!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="ASPECT LINK!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="DIGI STATION!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="CD BABY!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="ICECOLDENTERPRISE!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a>


<div class="slide" style="width:678px; height:262px; position:absolute; top:1475px; left:35px; overflow:hidden; overflow-x:hidden;">
<p style="visibility:visible;"><object type="application/x-shockwave-flash" data="http://widget-60.slide.com/widgets/slideticker.swf" height="350" width="548" style="width:548px;height:350px"><param name="movie" value="http://widget-60.slide.com/widgets/slideticker.swf" /><param name="quality" value="high" /><param name="scale" value="noscale" /><param name="salign" value="l" /><param name="wmode" value="transparent"/> <param name="flashvars" value="cy=ms&il=1&channel=3386706919800276832&site=widget-60.slide.com"/></object><p style="white-space:nowrap"><a href="http://www.slide.com/pivot?cy=ms&at=un&id=3386706919800276832&map=1" target="_blank"><img src="http://widget-60.slide.com/p1/3386706919800276832/ms_t000_v000_s0un_f00/images/xslide1.gif" border="0" ismap="ismap" /></a> <a href="http://www.slide.com/pivot?cy=ms&at=un&id=3386706919800276832&map=2" target="_blank"><img src="http://widget-60.slide.com/p2/3386706919800276832/ms_t000_v000_s0un_f00/images/xslide2.gif" border="0" ismap="ismap" /></a> <a href="http://www.slide.com/pivot?cy=ms&at=un&id=3386706919800276832&map=F" target="_blank"><img src="http://widget-60.slide.com/p4/3386706919800276832/ms_t000_v000_s0un_f00/images/xslide42.gif" border="0" ismap="ismap" /></a></p></p>

</div>

<div class="video" style="width:480px; height:295px; position:absolute; top:1850px; left:60px; overflow:hidden; overflow-x:hidden;">
<object width="480" height="295"><param name="movie" value="http://www.youtube.com/v/f1dvIQ5-UhI&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/f1dvIQ5-UhI&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="295"></embed></object>

</div>

</div>

Code for music player in the sounds like sections:

CODE

<style>
{!-music player-!}
table table td.text div object {position:absolute !important; top:709px !important; left:311px}
table table td.text div object object {position:static !important;}
</style>

Thanks again..

Reason for edit: Please use [codebox] tags instead of [code] tags when posting longer codes. - Mike

[shutterleftopen]

Thanks.

It puts the player above the layout but when i do the positioning from left to right on my other computer where the screen is smaller it's off. is that from absolute positioning? is there a way to fix that so it's the same within the div like all the other videos, slideshows, etc.?

[shutterleftopen]

it worked a little better. but it still isn't adjusting the position within the div. is there a way to put the music player inside the div?

all of the link boxes and slideshow, etc. all position themselves within the perameters of the div section. when they do that it allows all of the sections to be seen in the same position regardless of screen size. the music player is not allowing me to do that. i need there to be a way to have the music player position itself within the div so everything will be even on all screen sizes.

[shutterleftopen]

but when i put the music player in perfect for my screen, it doesn't put it in the right position on other size screens.there's no way at all? in this page:

Click here for this page

the music player is in the div and the entire layout is covered up but i'm using a different layout. i like the newer code vs. that older code because it's updated but that one i did get to work.and that page that shows the music player perfectly within the right place covers up the entire page. i don't want the newer page to cover up the whole layout.

Click Here

The page above shows a music player that stays consistant in the same type of layout that i am using. I am not able to find the music player section because he has not used the same code that i have used for the music player.






EDIT:

Is there a way to position the music player from top center? That way it will be the same on all computers..

Reason for edit: Posts merged. Please don't double post. Thanks -Nat

[Mickey]

You're having problems because you're using two codes to move the music player around. Replace your Members codes with this:

CODE

<style>
.profileWidth table { margin-bottom:2410px; width:800px; }
.rail { display:none; }
.gap {
background:url() top left no-repeat;
width:800px; height:2410px;
position:absolute; top:0; left:50%;
margin:0px -400px -2198px;
</style>


<div class="gap"></div>


<style>
.masthead {position:absolute; top:175px; margin-left:-400px; left:50%; width:800px; height:2124px; z-index:2;}
table div.slide {display:block; visibility:visible;}
table div.layout {display:block; visibility:visible;}
table div.myBio {display:block; visibility:visible;}
table div.video {display:block; visibility:visible;}
</style>


<div class="masthead">



<img src=" http://aspect-photos.com/ratedr/ratedr-overlay-jpg.jpg" /><a href="ADD FRIEND" style="position:absolute; top:710px; left:100px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:120px;" /></a><a href="MESSAGE US!!!!" style="position:absolute; top:830px; left:40px;">
<img src="http://x.myspace.com/images/clear.gif" style="width:190px; height:90px;" /></a><a href="WEBSITE!!!!!!!" style="position:absolute; top:800px; left:270px;"><img src="http://x.myspace.com/images/clear.gif" style="width:530px; height:200px;" /></a><a href="VIEW PHOTOS!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="ASPECT LINK!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="DIGI STATION!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="CD BABY!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a><a href="ICECOLDENTERPRISE!!!!" style="position:absolute; top:20px; left:20px;"><img src="http://x.myspace.com/images/clear.gif" style="width:130px;height:50px;" /></a>



<div class="slide" style="width:678px; height:262px; position:absolute; top:1475px; left:35px; overflow:hidden; overflow-x:hidden;">
<p style="visibility:visible;"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" height="350" width="548" style="width:548px;height:350px">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://widget-60.slide.com/widgets/slideticker.swf" />
<param name="wmode" value="transparent" />
<param name="quality" value="high" />
<param name="scale" value="noscale" />
<param name="salign" value="l" />
<param name="flashvars" value="cy=ms&il=1&channel=3386706919800276832&site=widget-60.slide.com" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" src="http://widget-60.slide.com/widgets/slideticker.swf" height="350" width="548" style="width:548px;height:350px" wmode="transparent" quality="high" scale="noscale" salign="l" flashvars="cy=ms&il=1&channel=3386706919800276832&site=widget-60.slide.com" />
</object><p style="white-space:nowrap"><a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnNsaWRlLmNvbS9waXZvdD9jeT1tcyZhdD11biZpZD0zMzg2NzA2OTE5ODAwMjc2
DMyJm1hcD0x" target="_blank"><img src="http://widget-60.slide.com/p1/3386706919800276832/ms_t000_v000_s0un_f00/images/xslide1.gif" border="0" /></a> <a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnNsaWRlLmNvbS9waXZvdD9jeT1tcyZhdD11biZpZD0zMzg2NzA2OTE5ODAwMjc2
DMyJm1hcD0y" target="_blank"><img src="http://widget-60.slide.com/p2/3386706919800276832/ms_t000_v000_s0un_f00/images/xslide2.gif" border="0" /></a> <a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnNsaWRlLmNvbS9waXZvdD9jeT1tcyZhdD11biZpZD0zMzg2NzA2OTE5ODAwMjc2
DMyJm1hcD1G" target="_blank"><img src="http://widget-60.slide.com/p4/3386706919800276832/ms_t000_v000_s0un_f00/images/xslide42.gif" border="0" /></a></p></p>

</div>

<div class="video" style="width:480px; height:295px; position:absolute; top:1850px; left:60px; overflow:hidden; overflow-x:hidden;">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" height="295" width="480">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://www.youtube.com/v/f1dvIQ5-UhI&hl=en&fs=1" />
<param name="wmode" value="transparent" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" src="http://www.youtube.com/v/f1dvIQ5-UhI&hl=en&fs=1" height="295" width="480" wmode="transparent" />
</object>





</div>


</div>

<style>
{!-music player-!}
table table td.text div object {position:absolute !important; top:881px !important; left:50%; margin-left:-88px; z-index:9;}
table table td.text div object object {position:static !important; margin:auto; z-index:9;}
</style>

Remove the codes in your Influences section and that should solve your problem.

[shutterleftopen]

Hey Mike,

Thanks a lot man. greatly appreciated.

[Mickey]

No problem. Topic closed & moved.