teddy: div-container bündig aneinander legen

hi leute!

ich habe einen divcontainer mit der festen weite 777px. dieser wird per margin left und right mit den weerten auto zentriert.

nun möchte ich einen div container links de zentrierten divs anlegen, der genau sobreit wie dieser wert auto ist, da dieser inen hintergrund enthält, der bündig an den zentrierten div anschließen soll.

was gibt es hier für möglichkeiten? vielleicht einfach drei divs nebeneinander, der mitlere auf width777 und die anderen sollen automatisch links und rechts gleich breit erscheinen? so wäre es optimal. wie laässt sich dies realisieren?

muss ich vielleicht doch ne blind-table mit drei colums benutzen? wollte doch eigentlich darauf verzichten :(

lg teddy

  1. Hi,

    vlt hilft dir diese seite weiter: http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html

    lg
    Rondra

  2. hi nomma,
    hab hier mal eine kleine testseite angelegt. hilft dir das ?

    <?xml version="1.0" encoding="UTF-8"?>
    <html>
    <head>
    <style type="text/css">
     body{margin:auto;pading:auto;}
     div
     {
      border:1px solid black;
     }
     div#main
     {
      width:100%;

    }
     div#links {margin-left:0px;float:left}
     div#mitte {width:777px; float:left;}
     div#rechts {margin-right:0px;float:right}
    </style>
    <script type="text/javascript">
     var d = document;
     //getting browserwindow width
     function getWindowWidth()
    {
     var windowWidth;
     if (navigator.appName=="Microsoft Internet Explorer") windowWidth = d.body.clientWidth;
     else windowWidth = window.innerWidth;
     return windowWidth;
    }
     function resize()
    {
     var winW = getWindowWidth();
     var boxes;
     if(winW > 777) boxes = (winW - 777) /2 + "px";
     else boxes = "0px";

    d.getElementById("links").style.width= boxes;
     d.getElementById("rechts").style.width= boxes;

    }
    </script>
    <body onload="resize()" onresize="resize()">
    <div id="links">links</div>
    <div id="mitte">mitte</div>
    <div id="rechts">rechts</div>
    </body>
    </html>

    lg
    Rondra