tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
2
ZUGRIFFE
519
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    Avatar von mr_floppy
    mr_floppy mr_floppy ist offline Mitglied Silber
    Registriert seit
    Apr 2008
    Beiträge
    83
    Hi,

    ich habe Probleme dabei ein ganz einfaches Layout mit divs zu erstellen. Das Bildchen sollte erklären können, was ich möchte:

    http://i26.tinypic.com/2zsy2ae.png

    Was muss im Code geändert werden, damit unter der Box "2" noch mal die selbe Box erscheint? Muss ich die linken und rechten Boxen (2 und 4) nochmal in eine Box packen, oder geht das auch anders/einfacher?

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    
    .container {
        width: 930px;
        margin-left: auto;
        margin-right: auto;
        
    }
     
    .hbox {
        width: 925px;
        height: 120px;
        border: 1px solid #006D00;
    }
     
    .lbox {
        width: 200px;
        margin-top: 10px;
        border: 1px solid #006D00;
        float:left;
    }
     
    .mbox {
        width: 500px;
        height:500px;
        margin-top: 10px;
        margin-left: 10px;
        float:left; 
        border: 1px solid #006D00;
    }
     
    .rbox {
        width: 200px;
        margin-top: 10px;
        margin-left: 10px;
        float:left; 
        border: 1px solid #006D00;
    }
     
    .fbox {
        width: 925px;
        margin-top: 10px;
        margin-left: 10px;
        float:left; 
        text-align: center;
        border: 1px solid #006D00;
    }

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    
    <div class="container">
    <div class="hbox">1</div>
    <div class="lbox">2</div>
    <div class="mbox">3</div>
    <div class="rbox">4</div>
    <div class="fbox">footertext...</div>
     
    </div>

    Danke im Vorraus!


    MfG
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    binde hierzu im DIV .lbox weitere Blöcke ein, die den oberen Außenabstand und Rahmen erhalten:

    Code :
    1
    2
    3
    4
    
    <div class="lbox">
         [B]<div class="lboxContent">2</div>
         <div class="lboxContent">2</div>[/B]
    </div>
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    
    .lbox {
            width: 200px;
            float:left;
    }
     
    [b].lboxContent { 
          margin-top: 10px;
          border: 1px solid #006D00;
    }[/B]
    mfg Maik
     

  3. #3
    Avatar von mr_floppy
    mr_floppy mr_floppy ist offline Mitglied Silber
    Registriert seit
    Apr 2008
    Beiträge
    83
    Ok, also doch noch eine übergeordnete Box. Passt jetzt alles. Danke dir für die schnelle Hilfe.

    *erledigt*


    MfG
     

Ähnliche Themen

  1. Antworten: 0
    Letzter Beitrag: 20.08.10, 23:47
  2. Zwei Boxen/Panels nebeneinander ausrichten
    Von BastianW im Forum Swing, Java2D/3D, SWT, JFace
    Antworten: 3
    Letzter Beitrag: 25.05.09, 11:22
  3. Antworten: 7
    Letzter Beitrag: 10.04.08, 12:06
  4. Boxen am Raster ausrichten
    Von JannyR im Forum 3D Studio Max
    Antworten: 1
    Letzter Beitrag: 27.06.05, 03:43
  5. Problem beim ausrichten eines Frames
    Von cardex im Forum HTML & XHTML
    Antworten: 4
    Letzter Beitrag: 27.10.01, 12:06