Positioning the playlist..., how do i put it INTO a skin? Options

[tiffythepoopoo]

I made a layout, but it's NOT with div layers, like it doesn't endlessly go on and on. It's a square thingy for the blogbody and there's a scrollbar on the side to go up and down on the entries. I made another square thingy on the other side to put my playlist in. But how do I position it? Thanks for your help. :D

[talcumpowder]

Fine-tune this.

<!-- begin code provided by createblog.com --><br /><IMG NAME="marykateandashley0" SRC="http://img.photobucket.com/albums/v619/tiffyindian/jared.gif" WIDTH="730" HEIGHT="535" BORDER="0" USEMAP="#marykateandashley"><br /><br /><div align="left"><br /><br /><div style="position:absolute; margin-left:-710; margin-top:-100;"><br /><object id="darkplayer" codeBase="http://a420.v8383d.c8383.g.vm.akamaistream.net/7/420/8383/3b858b51/mtvrdstr.download.akamai.com/8512/wmp/2/803/27860_1_11_04.asf" type="application/x-oleobject" height="0" standby="Loading Microsoft Windows Media Player components..." width="0" classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"><br />  <param NAME VALUE><br />  <param NAME="ShowControls" VALUE="0"><br />  <param NAME="ShowStatusBar" VALUE="0"><br />  <param NAME="ShowDisplay" VALUE="0"><br />  <param NAME="DefaultFrame" VALUE="Slide"><br /><br />  <param NAME="Autostart" VALUE="1"><br />  <param NAME="Loop" VALUE="True"><br /></object><br /><form name="form"><br /><center><br /><select style="FONT-SIZE: 8pt; BACKGROUND: #ffffFF; WIDTH: 220; COLOR: #000000; font-face: normal 8pt terminal; letter-spacing:0px; font: normal 8pt terminal; text-transform:lowercase;height:5" name="playlist" size="1"><br />  <option value="0">1:: eisley. telescope eyes</option><br />  <option value="1">2:: alexisonfire. 44 caliber love letter</option><br />  <option value="2">3:: daphne loves derby. the longest story</option><br /><br />  <option value="3">4:: lola ray. automatic girl</option><br />  <option value="4">5:: avenged sevenfold. chapter four</option><br />  <option value="5">6:: the capricorns. the new sound</option><br />  <option value="6">7:: hot hot heat. goodnight</option><br />  <option value="7">8:: a thorn for every heart. night to remember</option><br />  <option value="8">9:: paris texas. bombs away</option><br /><br />  <option value="9">10:: le tigre. deceptacon</option><br />  <option value="10">11:: dirty sanchez. f**king on the dancefloor</option><br />  <option value="11">12:: bob marley. pass the dutchie</option><br />  <option value="12">13:: capricorns. pretty girls</option><br />  <option value="13">14:: ladytron. playgirl</option><br />  <option value="14">15:: atc. mistake no. 2</option><br /><br />  <option value="15">16:: roller girl. love</option><br />  <option value="16">17:: atreyu. ain't love grand</option><br />  <option value="17">18:: the academy is. checkmarks</option><br />  <option value="18">19:: jadyn maria. rock you senseless</option><br />  <option value="19">20:: kelly osbourne. one word</option><br />  </select><br><br /><br />  <input TYPE="BUTTON" NAME="darkplay" VALUE="play" OnClick="play(document.forms['form'].playlist);"><br />  <input TYPE="BUTTON" NAME="darkpause" VALUE="pause" OnClick="document.darkplayer.pause(); playstate=2;"><br />  <input TYPE="BUTTON" NAME="darkstop" VALUE="stop" OnClick="document.darkplayer.stop(); playstate=2;"></p><br /></form><script language="JavaScript"><br /><!--<br />var playstate = 1;<br />shuffle = 1;  // set to 0 to always play first song in list<br />                // set to 1 to randomly choose the first song to play<br />songs=new Array();<br />songs[0]="http://www.straylight6.org/ep1/mp3/Eisley-EP1-Telescope_Eyes.mp3"; <br />songs[1]="http://www.evrhq.com/mp3/alexisonfire_-_44_caliber_love_letter.mp3"; <br />songs[2]="http://flashrock.com/music/uploads/attachments/1111363883.mp3"; <br />songs[3]="http://www.redmusic.com/streams/LolaRay/AutomaticGirl.asx"; <br />songs[4]="http://download.wbr.com/avengedsevenfold/A7X-WTF-Chapter_Four.mp3"; <br />songs[5]="http://paroxysmrecords.com/sounds/The%20Capricorns%20-%20The%20New%20Sound%20(www.paroxysmrecords.com).mp3"; <br />songs[6]="http://download.wbr.com/GoodnightGoodnight.mp3"; <br />songs[7]="http://www.angelfire.com/zine2/tiffyfoshizzle/nighttoremember.wma"; <br />songs[8]="mms://kroq.wmod.llnwd.net/a168/o1/calendar04/paristexas/paristexas_bombsaway.asf";<br />songs[9]="http://webjay.org/by/danivalentin/list04.asx";<br />songs[10]="http://flashrock.com/music/uploads/attachments/1115610561.mp3";<br />songs[11]="http://www.digitalsoundplanet.com/Members/000145677_000022045.mp3?PHPSESSID=2382e910b58db1f2078500b45d0cc95b";<br />songs[12]="http://paroxysmrecords.com/sounds/The%20Capricorns%20-%20Pretty%20Girls%20(www.paroxysmrecords.com).mp3";<br />songs[13]="http://web3.epitonic.com/files/reg/songs/mp3/Ladytron-Playgirl.mp3";<br />songs[14]="http://mz_sh0rtie.tripod.com/mistakeno2.wma";<br />songs[15]="http://home.comcast.net/~canxcan/Roller_Girl_-_Love_You_More.mp3";<br />songs[16]="http://www.victoryrecords.com/Audio/DL/Atreyu_aintlovegrand.mp3";<br />songs[17]="http://www.fueledbyramen.com/mp3/the_academy_is_checkmarks.mp3";<br />songs[18]="http://flashrock.com/music/uploads/attachments/1112270993.mp3";<br />songs[19]="http://www.angelfire.com/zine2/tiffyhussein/Kelly_Osbourne_-_One_Word.mp3";<br />if (shuffle == 1) {<br />var randsg = Math.floor(Math.random()*songs.length);<br />document.darkplayer.FileName = songs[randsg];<br />document.darkplayer.scr = songs[randsg];<br />document.forms['form'].playlist.options[randsg].selected = true;<br />}<br />function play(list) {<br />if (playstate == 2) {<br />document.darkplayer.Play();<br />} else {<br />var snum = list.options[list.selectedIndex].value<br />document.darkplayer.FileName = songs[snum];<br />document.darkplayer.scr = songs[snum];<br />}<br />playstate = 1;<br />}<br />//--><br /></script><br /></tr><br /></table></div><br /><br /><style type="text/css"><br />#rblEprops, #pnlEnabled table, #pnlEprops table { <br />width: auto !important; <br />}<br />table.header, table.main, table.footer, table.navigation{<br />/* edit width */<br />width:296;<br />}<br />table.blogbody, div.blogheader, .caption{<br />width:343;<br />}<br />body {<br />background-color:75E3D0;<br />scrollbar-Arrow-Color: 000000;<br />scrollbar-Track-Color:#75E3D0;<br />scrollbar-Shadow-Color: 75E3D0;<br />scrollbar-Face-Color: 75E3D0;<br />scrollbar-Highlight-Color: #75E3D0;<br />scrollbar-darkshadow-color:  75E3D0;<br />scrollbar-3dLight-Color: 75E3D0;<br />font-family: arial;<br />font-size:8pt;<br />line-height:10px;<br />}<br />i{color:#3E7C71;}<br />em{color:#3E7C71;}<br />u{color:#000000;}<br />texttable.left, td.mainleft, table.left, table.navigation, table.footer, table.search {<br />display: none;<br />} <br />.blogbody b, .standard b, p b, strong {<br />/* edits bolded text in your entry */<br />  font-weight: bold;<br />  color: 3E7C71;<br />  }<br />.module, .left, .blogbody, table.footer, .standard, .leftmodulefontcolor, td, p, .content, .smalltext {<br />/* edits main text */<br />font:normal 8pt arial;line-height:10px;<br />color: #696969;letter-spacing:0px;word-spacing:0px;text-align:justify;<br /><br />}<br />a:link{<br />/* edit the links */<br />color: 008C74;line-height:10px;<br />text-decoration: none;font:normal 8pt arial;text-transform:lowercase; }<br />a:visited{<br />/* edit visited links */<br />color: 008C74;line-height:10px;<br />text-decoration: none;font:normal 8pt arial;text-transform:lowercase;  }<br />a:hover {<br />color: 000000;line-height:10px;<br />text-decoration: underline; font:normal 8pt arial;letter-spacing:1px; cursor:crosshair;}<br />.blogbody td{<br />/* entry margins */<br />width: 0px;<br />padding-left: 0px<br />}<br />input, select, textarea, .textfield, .button{<br />/* this edits buttons, drop down menus etc. */<br />border: none;<br />font:bold 11pt arial; <br />background-color: transparent;text-transform:UPPERCASE;<br />letter-spacing:0px;<br />color:#603F1B;cursor:hand;<br />}<br />div.blogheader, .caption {<br />/* edit the dates */<br /><br />text-transform:uppercase;<br />letter-spacing:3px;<br />font:bold 8pt arial;<br />color: #ffffff;<br />background-color: transparent;<br />text-align: center;<br />font-weight:bold;<br />padding-left:4px;<br />padding-bottom:0px;<br />padding-right:0px;<br />padding-top:3px;<br />}<br />table.blogbody {<br />/* edits your blog or entry space */<br />border: 0px;<br />background-color:transparent;<br />padding-top:0px;<br />padding-right:0px;<br />}<br />table.blogbody div.smalltext{<br />/* this edits the blog entry footer */<br />  text-align: center;<br />  padding: 10px;<br />  width: 100%;<br />  font-weight: bold;<br />  }<br />hr {<br />color: #000000;<br />}<br />div.blogspace {<br />width:369px;<br />height:254px;<br />margin-left:365px;<br />margin-top:-353px;<br />overflow:auto;<br />scrollbar-Arrow-Color: 000000;<br />scrollbar-Track-Color:#75E3D0;<br />scrollbar-Shadow-Color: 75E3D0;<br />scrollbar-Face-Color: 75E3D0;<br />scrollbar-Highlight-Color: #75E3D0;<br />scrollbar-darkshadow-color:  75E3D0;<br />scrollbar-3dLight-Color: 75E3D0;<br /><br />}<br /></style><br /><br /><div align="center" class="blogspace"><br /><!-- end code provided by createblog.com -->