Hilfe! wie kann ich die mainbox (profil) rechts mitscrollen lassen??

    also die frage steht ja schon oben...
    ich wollte für tumbrl ein template ändern, aber ich kann iwie das profilfenster nicht an die rechte seite "verschieben" und mitlaufen lassen...
    ich poste hier einfach mal den code vll kann mir ja jemand helfen :/

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>{Title}</title>
    <link rel="shortcut icon" href="{Favicon}">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">
    {block:Description}
    <meta name="description" content="{MetaDescription}" />
    {/block:Description}

    <style type="text/css">
    body{
    background: url(http://img833.imageshack.us/img833/7352/ab…andcolors.jpg);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-attachment:fixed;
    background-color:#8d847a;
    font:10pt Brandish, Commons, Clarendon, Arial, Geneva, sans-serif;
    color:#cac6c1;
    line-height:19px;}

    a,a:link,a:visited,a:active{
    color:#8b837a;
    text-decoration:none;}

    a:hover{
    color:#cac6c1;
    text-decoration:none;}

    .old a{
    background-color:#110e0c;
    position:fixed;
    top:80%;
    right:50px;
    width:80px;
    height:57px;
    display:block;
    text-align:center;
    padding-top:23px;
    font-size:45pt;
    filter:alpha(opacity=90);
    opacity:0.9;
    -moz-border-radius:10px;
    border-radius:10px;}

    .old a:hover, .new a:hover{
    color:#8b837a;
    background-color:#221d19;}


    .new a{
    background-color:#110e0c;
    position:fixed;
    top:80%;
    left:50px;
    width:80px;
    height:57px;
    display:block;
    text-align:center;
    padding-top:23px;
    font-size:45pt;
    filter:alpha(opacity=90);
    opacity:0.9;
    -moz-border-radius:10px;
    border-radius:10px;}


    #container{
    position:absolute;
    top:20px;
    left:10%;
    width:630px;
    overflow:visible;
    background-color:transparent;
    border:none;}

    a.nav, .bottom a{
    font-size:12pt;
    letter-spacing:-1px;
    padding:5px;
    background-color:#635b53;
    color:#110e0c;
    font-weight:bold;
    margin-right:5px;
    -moz-border-radius:5px;
    border-radius:5px;}

    a.nav:hover, .bottom a:hover{
    background-color:#8d847a;}

    #main{margin: 0;}

    #mainbox{
    width:630px;}

    .content{
    float:right;
    width:500px;
    background-color:#110e0c;
    padding:15px;
    margin-bottom:20px;
    border-bottom:10px solid #221d19;
    filter:alpha(opacity=90);
    opacity:0.9;
    -moz-border-radius:10px;
    border-radius:10px;}

    #info{
    float:left;
    width:100px;}

    .datebubble{
    background-color:#F2F2D9;
    padding:15px 0 0 0;
    text-align:center;
    font-weight:bold;
    margin:0 0 0 10px;
    width:64px;
    height:49px;
    filter:alpha(opacity=90);
    opacity:0.9;
    -moz-border-radius:10px;
    border-radius:10px;}

    .datebubble a{font-size:12pt;}
    .datebubble a:hover{color:#635b53;}

    .notesbubble{
    background-color:#ffffff;
    padding:12px 0 0 0;
    text-align:center;
    font-weight:bold;
    margin:10px 0 0 45px;
    width:40px;
    height:28px;
    filter:alpha(opacity=90);
    opacity:0.9;
    -moz-border-radius:10px;
    border-radius:10px;}

    .notesbubble a{font-size:9pt; color:#110e0c;}
    .notesbubble a:hover{color:#635b53;}


    .portraitbubble{
    margin:0 0 0 10px;
    width:64px;
    height:64px;
    filter:alpha(opacity=90);
    opacity:0.9;}

    .portraitbubble img{
    -moz-border-radius:10px;
    border-radius:10px;}

    .clear{clear:both;}

    .bottom{
    margin-top:20px;
    text-align:center;}

    .photo{text-align:center;}

    #footer{
    clear:both;
    margin: 100
    height:35px;
    width:630px
    text-align:center;
    font-size:12pt;
    font-weight:bold;
    letter-spacing:-1px;
    color:#110e0c;}

    #footer a{color:#221d19!important;}
    #footer a:hover{color:#110e0c!important;}

    ul.chat{
    list-style-type:none;
    margin:0 0 5px 0;
    padding:0;}

    li.odd{
    font-weight:bold;}

    li.even{
    font-weight:bold;
    color:#8b837a;}

    .quote{
    line-height:18px;
    color:#635b53;
    letter-spacing:-1px;
    font-weight:bold;
    margin-bottom:5px;
    font-size:14pt;
    text-align:center;}

    .source, .caption{
    text-align:center;
    font-weight:bold;
    font-size:11pt;}

    .audio{
    width:500px;
    text-align:center;
    padding:0;
    margin:0 0 0 10px;}

    h1, h1 a, a.link{
    line-height:24px;
    font-size:20pt;
    letter-spacing:-2px;
    color:#635b53 !important;
    padding:0;
    margin-top:0;
    margin-bottom:5px;
    font-weight:bold;}

    h1 a:hover, a.link:hover{
    color:#cac6c1 !important;}

    ul{list-style-type:dot;}

    blockquote{
    font-style:normal !important;
    text-align:left !important;
    margin:0 0 0 10px;
    border-left:3px solid #8b837a;
    padding:0 0 0 6px;}

    ol.notes {
    margin:0 0 20px 60px;
    width:530px;
    list-style-type: none;}

    ol.notes li.note {
    color:#cac6c1;
    border:none;
    padding:3px;
    background-color:#110e0c;
    border-bottom:3px solid #221d19;
    filter:alpha(opacity=90);
    opacity:0.9;
    -moz-border-radius:3px;
    border-radius:3px;}

    ol.notes li.note img.avatar {
    vertical-align:-4px;
    margin-right:10px;
    width:16px;
    height:16px;}

    {CustomCSS}
    </style>
    </head>


    <body>

    <div id="container">

    <div class="old">
    {block:Pagination}
    {block:NextPage}
    <a href="{NextPage}">
    &raquo;
    </a>
    {/block:NextPage}
    {/block:Pagination}
    </div>

    <div class="new">
    {block:Pagination}
    {block:PreviousPage}
    <a href="{PreviousPage}">
    &laquo;
    </a>
    {/block:PreviousPage}
    {/block:Pagination}
    </div>


    <div id="main">

    <div id="mainbox">
    <div id="info">
    <div class="portraitbubble">
    <img src="{PortraitURL-64}">
    </div>
    </div>
    <div class="content">
    <h1>{Title}</h1>
    {Description}<br><br>
    <center>
    <a class="nav" href="/">Home</a>
    <a class="nav" href="/archive">Archive</a>
    <a class="nav" href="{RSS}">RSS</a>
    <a class="nav" href="/ask">Ask</a>
    {block:HasPages}
    {block:Pages}
    <a class="nav" href="{URL}">{Label}</a>
    {/block:Pages}
    {/block:HasPages}
    </center>
    </div>
    </div>
    <div class="clear"></div>


    {block:Posts}

    <div id="mainbox">
    <div id="info">
    <div class="datebubble">
    {block:Date}
    <a href="{Permalink}">
    {MonthNumber}.{DayOfMonth}<br>{Year}
    </a>
    {/block:Date}
    </div>
    <div class="notesbubble">
    {block:NoteCount}
    <a href="{Permalink}#notes">{NoteCount}</a>
    {/block:NoteCount}
    </div>
    </div>
    <div class="content">

    {block:Text}
    {block:Title}
    <h1><a href="{Permalink}">{Title}</a></h1>
    {/block:Title}
    {Body}
    {/block:Text}


    {block:Photo}
    <div class="photo">
    {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" border="0"/>{LinkCloseTag}
    </div>
    {block:Caption}
    <div class="caption">
    {Caption}
    </div>
    {/block:Caption}
    {/block:Photo}



    {block:Photoset}
    <div class="photo">
    {Photoset-500}
    </div>
    {block:Caption}
    <div class="caption">
    {Caption}
    </div>
    {/block:Caption}
    {/block:Photoset}


    {block:Quote}
    <div class="quote">
    {Quote}
    </div>
    {block:Source}
    <div class="source">
    {Source}
    </div>
    {/block:Source}
    {/block:Quote}


    {block:Link}
    <a href="{URL}" class="link" {Target}>{Name}</a>
    {block:Description}
    {Description}
    {/block:Description}
    {/block:Link}


    {block:Chat}
    {block:Title}
    <h2><a href="{Permalink}">{Title}</a></h2>
    {/block:Title}
    <ul class="chat">
    {block:Lines}
    <li class="{Alt} user_{UserNumber}">
    {block:Label}
    <span class="label">{Label}</span>
    {/block:Label}
    {Line}
    </li>
    {/block:Lines}
    </ul>
    </li>
    {/block:Chat}


    {block:Video}
    {Video-400}
    {block:Caption}
    <div class="caption">
    {Caption}
    </div>
    {/block:Caption}
    {/block:Video}


    {block:Audio}
    <div class="audio">
    {AudioPlayerBlack}
    </div>
    {block:Caption}
    <div class="caption">
    {Caption}
    </div>
    {/block:Caption}
    {/block:Audio}

    <div class="bottom">
    <a href="{Permalink}">Permalink</a>
    <a href="{ReblogURL}">Reblog</a>
    </div>
    </div></div><div class="clear"></div><div class="clear"></div>

    {PostNotes}
    {/block:Posts}
    </div>

    <div id="footer">


    </div>

    </body>
    </html>

    Entschuldigung, aber erwartest du von uns jetzt das wir uns die zisch tausend ungeordneten Zeilen durchlesen und versuchen die Stelle zu finden die für dein Problem nötig ist?
    Also kann sein das es einer macht, aber wäre schön wenn du das mal etwas gekürzter, geordneter und innerhalb der dafür vorgesehenen Codefelder editierst! Weil so tu ich mir das nicht an! ;)

    MfG

    also das ist der code für das fenster welches ich gerne recht am rand mitscrollen möchte...
    das problem ist nur, dassdie normalen posts und das fenster, was ich gerne ändern möchte, sich nicht voneinander unabhängig ändern lassen (oder ich hab bis jetzt noch nicht gefunden wie...)


    <div id="main">

    <div id="mainbox">
    <div id="info">
    <div class="portraitbubble">
    <img src="{PortraitURL-64}">
    </div>
    </div>
    <div class="content">
    <h1>{Title}</h1>
    {Description}<br><br>
    <center>
    <a class="nav" href="/">Home</a>
    <a class="nav" href="/archive">Archive</a>
    <a class="nav" href="{RSS}">RSS</a>
    <a class="nav" href="/ask">Ask</a>
    {block:HasPages}
    {block:Pages}
    <a class="nav" href="{URL}">{Label}</a>
    {/block:Pages}
    {/block:HasPages}
    </center>
    </div>
    </div>
    <div class="clear"></div>


    wenn es hilft:
    http://marcerdmann.tumblr.com/

    Also, da ich nicht ganz finde um was genau es geht hier mal die normalen Ansätze mit denen ich anfangen würde:
    wenn das was du willst und das was du nicht willst in der selben div/id/class oder so sind dann füge einfach um das was du willst ne eigene div ein um das getrennt zu steuern.
    Dann zu dem das es mitscrollt: einfach im style oder css als Atribut "position:fixed;" und dann mit right und top den Abstand fest machen den das haben soll, wenn du mit right arbeitest hast du automatisch das es auch rechts ist.

    MfG

    ok... problem hab ich gelöst :)
    aba da sind noch ein paar kleinigkeiten, die mich stören - also wer lust und zeit hat: hier nochmal nachfragen, dann schreib ich den neuen quellcode hierrein und so...