Hello im trying to write a code for a profile of mine I have one scroll box displaying the music I like but when I try to add another scrollbox it just goes below it , anyone know how to get them to go side by side?
the code for the scroll box is :

<center><div style="width: 260px; height: 100px; overflow: auto; padding: 5px; border-color:purple; border-style:solid; align=center">
<center><a href="http://photobucket.com/" target="_blank"><img src="http://i139.photobucket.com/albums/q304/emygurl123/music-1.gif" border="0" alt="Photobucket - Video and Image Hosting"></a><br><br>
Metallica<br>
Alexisonfire<br>
The Misfits<br>
Taking Back Sunday<br>
Rise Against<br>
From First To Last<br>
Scary Kids Scaring Kids<br>
Black Sabbath<br>
Saliva<br>
Brand New<br>
Fear Before The March Of Flames<br>
The Used<br>
Rancid<br>
Pantera<br>
Saosin<br>
Finch<br>
Alter Bridge<br>
WWE Songs<br>
Megadeth<br>
Seether<br>
Glory Of This<br>
HammerFall<br>
UnderOATH<br>
Trivium<br>
Bullet For My Valentine<br>
Aiden<br>
Bayside<br>
Anti-Flag<br>
Atreyu<br>
Avenged Sevenfold<br>
Billy Talent<br>
Chiodos<br>
Hellogoodbye<br>
Armor For Sleep<br>
</div>


Thanks
Con

Hi xCoNx,

Just seperate them into 2 <div>'s and add some CSS absolute positioning. Then you can put them anywhere on the screen as seperate objects.
I've removed the non-terminated <center> tags as they are not needed now ( they should have had </center> to terminate ), but left in the ones for the image.
Also, in the positioning from the left margin I've used percentages but you can change that to actual pixels if you wish. Percentages don'nt usually care about browser/screen resolutions and I'm just lazy!
Anyway, here's the new code;


<div style="position:absolute;left:25%;top:10px;width: 260px; height: 100px; overflow: auto; padding: 5px; border-color:purple; border-style:solid">
<center><a href="http://photobucket.com/" target="_blank"><img src="http://i139.photobucket.com/albums/q304/emygurl123/music-1.gif" border="0" alt="Photobucket - Video and Image Hosting"></a><br><br></center>
</div>
<div style="position:absolute;left:51%;top:10px;width: 260px; height: 100px; overflow: auto; padding: 5px; border-color:purple; border-style:solid; align=center">

Metallica<br>
Alexisonfire<br>
The Misfits<br>
Taking Back Sunday<br>
Rise Against<br>
From First To Last<br>
Scary Kids Scaring Kids<br>
Black Sabbath<br>
Saliva<br>
Brand New<br>
Fear Before The March Of Flames<br>
The Used<br>
Rancid<br>
Pantera<br>
Saosin<br>
Finch<br>
Alter Bridge<br>
WWE Songs<br>
Megadeth<br>
Seether<br>
Glory Of This<br>
HammerFall<br>
UnderOATH<br>
Trivium<br>
Bullet For My Valentine<br>
Aiden<br>
Bayside<br>
Anti-Flag<br>
Atreyu<br>
Avenged Sevenfold<br>
Billy Talent<br>
Chiodos<br>
Hellogoodbye<br>
Armor For Sleep<br>
</div>


Hope this is OK.
Regards,
Ges.

PS. When posting code it's much better to put it into the 'code' brackets provided. This makes everything much more readable for everyone. In the posting editor use the '#' symbol that you see at the top.