myGully.com

myGully.com (https://mygully.com/index.php)
-   Entwicklung & Programmierung (https://mygully.com/forumdisplay.php?f=72)
-   -   [Gelöst] CSS Layout mit div Boxen (https://mygully.com/showthread.php?t=2626749)

Tr3nDy 20.05.12 11:26

[Gelöst] CSS Layout mit div Boxen
 
Hallo,
ich habe meine Layouts bisher immer mit Tabellen aufgebaut, aber da das ja nun schon eine Weile aus der Mode gekommen ist, wollte ich mich mal an CSS bzw. div Boxen heranwagen.
Nun möchte ich folgendes Layout erstellen:
[Link nur für registrierte und freigeschaltete Mitglieder sichtbar. Jetzt registrieren...]
Ich bekomme das aber nicht so hin. Entweder ist Box3 neben Box1 und Box2 beginnt erst an der unterkannte von Box3, oder Box3 beginnt auf höhe der Oberkannte von Box2 und ist somit nicht neben Box1.
Könnte mir da villeicht jemand sagen mit welcher Technik ich das so hinbekomme wie ich es mir vorgestellt habe? Ein Beispiel wäre natürlich richtig geil^^.
Ich bedanke mich schonmal für eure Antworten.

EDIT: Bin jetzt schon nen Schritt weiter, passt aber immer noch nicht optimal zusammen. Mein CSS Code:
PHP-Code:

.Box1 {
background-image:url("http://mygully.com/images/header.png");
background-repeatno-repeat;
width:778px
height:75px
position:absolute
z-index:2
left:50%; 
top:0%;
margin-left:-500px
margin-top:60px;
visibility:visible;}

.
Box2 {
background-image:url("http://mygully.com/images/navi_bg.png");
background-repeatrepeat-x;
width:778px
height:59px
position:absolute
z-index:2
left:50%; 
top:0%;
margin-left:-500px
margin-top:135px;
visibility:visible;}

.
Box3 {
background-image:url("http://mygully.com/images/logo.png");
width:222px
height:134px
position:absolute
z-index:2
left:50%x
top:0%;
margin-right:278px
margin-top:60px;} 

Box3 liegt nun aber über Box1 und Box2 und nicht nebendran. Ich schau nochmal drüber, konnte aber beim ersten mal keinen Fehler entdecken.

EDIT: Fehler gefunden: left:50%x;

Harvey der Hase 27.05.12 10:55

Du musst die Box auch von links ausrichten. Also + Breite der box 1

Iconi 22.09.12 16:02

Arbeite mit den Attributen float: left | right | center


Alle Zeitangaben in WEZ +1. Es ist jetzt 10:25 Uhr.

Powered by vBulletin® (Deutsch)
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.