CSS - Positionierung von mehreren Bildern

blacksheep

Hallo zusammen,
unsere Intranet-Seiten sind bisher statisch mit Frames gestaltet. Das ganze soll ich jetzt mit CSS "nachbauen".

Da ich recht wenig Erfahrung mit Webdesign habe, wollte ich gerne mal wissen wie ihr das machen würdet.
Bei meinem CSS-Code (s.u.) funktionieren die repeat-x/y 's nicht. Ich glaube mittlerweile, dass die Div-Tags das ganze nicht mit machen. Wie sollte ich es aber sonst lösen?
Ein "background-image: .." in einer "body {}"-Klasse bringt mir leider nicht viel (auch wenn hier die repeat's funktionieren), da es 2 Bilder sind welche an unterschiedlichen Positionen wiederholt werden sollen.

<html>
  <head>
  <title>tms</title>
  <style type='text/css'>
    <!--
        body {
            background-image:   url(images/oben.jpg);
            background-repeat:  no-repeat;
            background-position:    left,top;
            margin-left:        100px;
            margin-top:     90px;
            margin-bottom:      80px;
        }

        .links_rand {
            background-image:   url(images/links_linie.jpg);
            background-repeat:  repeat-y;
            background-position:    left;
        }
        #div_links_rand {
            position:       absolute;
            left:           0px;
            top:            0px;
            width:          93px;
            height:         1px;
        }
        .unten {
            background-image:   url(images/unten.jpg);
            background-repeat:  no-repeat;
            background-position:    right,bottom;
        }
        #div_unten {
            position:       absolute;
            bottom:         0px;
            right:          0px;
            width:          560px;
            height:         74px;
        }
        .unten_ecke {
            background-image:   url(images/unten_ecke.jpg);
            background-repeat:  no-repeat;
            background-position:    left,bottom;
        }
        #div_unten_ecke {
            position:       absolute;
            left:           0px;
            bottom:         0px;
            width:          105px;
            height:         74px;
        }
        .unten_linie {
            background-image:   url(images/unten_linie.jpg);
            background-repeat:  repeat-x;
            background-position:    bottom;
        }
        #div_unten_linie {
            position:       absolute;
            bottom:         0px;
            left:           0px;
            width:          1px;
            height:         74px;
        }
    // -->
  </style>
  </head>
  <body>
    <div id='div_oben' class='oben'></div>
    <div id='div_unten_linie' class='unten_linie'></div>
    <div id='div_unten_ecke' class='unten_ecke'></div>
    <div id='div_unten' class='unten'></div>
  </body>
</html>

Mal abgesehen von meinem Problem.. Ist das überhaupt üblich einfach lehre Div-Tag's für die Formatierung zu machen? Kann ich mir kaum vorstellen, konnte allerdings auch nichts anderes finden !?

Bin mal gespannt was ihr dazu sagt..

Danke und Gruß aus Bonn,
Chris

SideWinder

Öhm seit wann benützt man class="" und id="" in einem DIV? Dachte eigentlich das wäre ein ODER?

Irgendwie sieht das DIV mit id='' und class='' aus als würde nur ID verarbeitet werden - aber ich bin mir jetzt auch nicht mehr sicher weil ich das noch nie gesehen habe...

BTW: Doppelte Anführungszeichen sind üblich.

MfG SideWinder

[ Dieser Beitrag wurde am 08.07.2003 um 15:18 Uhr von SideWinder editiert. ]

flenders

wollte ich auch gerade sagen - das mit id und class. Eines reicht doch hier vollkommen aus
' oder " sollte eigentlich keine Rolle spielen

Was ist denn der Fehler in der Darstellung? Wie sieht es aus und wie sollte es aussehen?

SideWinder

' oder " spielt auch keine Rolle aber imho ist " Standard, oder?

Also id und class schneiden sich offenbar wirklich. Denn laut dieser Beschreibung von ihm heißt es, dass nur die Definitionen die er per class='' angegeben hat (also die die nach id angegeben wurden) nicht funktionieren?

Denn dort gibt er ja das repeat-Statement an?!

Pack das in eine ID bzw. in eine Class!

MfG SideWinder

blacksheep

Hallo,
ich habe das ganze jetzt etwas umgeschrieben und eure Hinweise beachtet. Nach ein paar Versuchen hats dann auch geklappt
Danke für eure Hilfe!
Gruß, Chris