Ergebnis 1 bis 7 von 7

Thema: divs anordnen

  1. #1
    Unregistriert
    Gast

    Standard divs anordnen

    tag

    kleine frage. ich versuch hier grade ein paar divs anzuordnen und weiss nicht weiter.

    also 3 divs untereinander - fertig.

    dann sollen 3 oder auch 4 divs rechts neben die drei aber so das wieder oben angefangen wird. ich bräuchte nur die floats und wo man in dem fall ein clear setzen muss.

    danke
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Unregistriert
    Gast

    Standard AW: divs anordnen

    Dein Versuch sieht bisher wie aus?

  3. #3
    Unregistriert
    Gast

    Standard AW: divs anordnen

    sorry vergessen code zu posten. also wenn ich es so mache dann beginnt die 2te bigbox links unter dem news div

    [css]
    .minilog{
    padding: 10px;
    border: 1px solid #bababa;
    width: 200px;
    -moz-border-radius: 5px;
    margin-left: 20px;
    float: left;
    }

    .bigbox{
    width: 534px;
    border: 1px solid #bababa;
    -moz-border-radius: 5px;
    padding: 10px;
    margin-bottom: 10px;
    float: left;
    }

    .bigbox_1{
    width: 534px;
    border: 1px solid #bababa;
    -moz-border-radius: 5px;
    padding: 10px;
    margin-bottom: 10px;
    }

    .news{
    padding: 10px;
    border: 1px solid #bababa;
    width: 200px;
    -moz-border-radius: 5px;
    margin-left: 20px;
    margin-top: 10px;
    float: left;
    }
    [/css]

    HTML-Code:
    <div class="content">
    
          <!-- bigbox beginn -->
                <div class="bigbox">
                ------------------------ Text
                </div>
          <!-- end -->
    
          <!-- minilog beginn -->
                <div class="minilog">
                <div class="titel_r"><b>Login</b></div>
                <input class="input_r" type="text" name="login" />
    
                <!-- clear -->    <div class="clear"></div>     <!-- end -->
    
                <div class="titel_r"><b>Passwort</b></div>
                <input class="input_r" type="password" name="password" />
    
                <!-- clear -->    <div class="clear"></div>     <!-- end -->
    
                      </div>
          <!-- end -->
    
          <!-- news beginn -->
                <div class="news">
                --------------------------- Text
                </div>
          <!-- end -->
    
          <div class="clear"></div>
    
          <!-- bigbox beginn -->
                <div class="bigbox">
                ---------------------------- Text
                </div>
          <!-- end -->
    </div>

  4. #4
    Meister(in) Avatar von lukasn
    Registriert seit
    23.02.2008
    Ort
    Schweiz
    Alter
    27
    Beiträge
    491
    Danke
    2
    Bekam 12 mal "Danke" in 11 Postings

    Standard AW: divs anordnen

    Ich versteh ehrlich gesagt nicht ganz, wie du deine Boxen jetzt anordnen willst, aber die einfachste Variante ein Zweispaltiges Float-Layout zu machen ist so:

    HTML-Code:
    <div id="content">
     <div id="box_left">
      <p>Füllinhalt</p>
     </div>
     
     <div id="box_right">
      <p>Füllinhalt2</p>
     </div>
     <span style="clear:both></span>
    </div>
    Code:
    #box_left {
     float: left;
     width: 30%;
    }
    #box_right {
     width: 70%;
     margin-left: 30%;
    }
    Alles das auf die Linke Seite gehört kommt dann in die "box_left" und andersrum. Die Breitenangeaben sind natürlich variabel, relevant ist eigentlich nur dass der margin-left von box_right und die Breite von box-left mindestens gleich gross sind. Boxmodell beachten, der Rahmen spielt auch noch eine Rolle

    Falls du eine bessere Gliederung deines Markups brauchst kannst dua auch mit Position arbeiten, empfiehlt sich aber für einen anfänger nicht unbedingt.

  5. #5
    Meister(in)
    Registriert seit
    10.01.2008
    Ort
    Passau/Ösiland
    Beiträge
    267
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: divs anordnen

    Zitat Zitat von lukasn Beitrag anzeigen
    Falls du eine bessere Gliederung deines Markups brauchst kannst dua auch mit Position arbeiten, empfiehlt sich aber für einen anfänger nicht unbedingt.
    Für einen Fortgeschrittenen empfiehlt sich das noch viel weniger.
    Mit Float arbeiten und die Dinge ansonsten im Fluß lassen.
    Positionieren nur da, wo es unbedingt notwendig ist.

    Zitat Zitat von lukasn Beitrag anzeigen
    Code:
    #box_left {
     float: left;
     width: 30%;
    }
    #box_right {
     width: 70%;
     margin-left: 30%;
    }
    Das ist auch überhaupt keine gute Idee.
    Im professionellen Webdesignbereich wird aus gutem Grund praktisch so gut wie nicht mit %-Breiten gearbeitet.
    Die Nachteile überwiegen die Vorteile:
    Je kleiner der Bildschirm desto schmaler werden die Spalten bis hin zu unschönen Überlappungen, wenn Bilder im Spiel sind.
    Bei festen Breiten bekommt man nur einen Scrollbalken, was nach allgemeiner Ansicht das kleinere Übel ist.

  6. #6
    Meister(in) Avatar von lukasn
    Registriert seit
    23.02.2008
    Ort
    Schweiz
    Alter
    27
    Beiträge
    491
    Danke
    2
    Bekam 12 mal "Danke" in 11 Postings

    Standard AW: divs anordnen

    ...wenn du den ganzen Post gelesen hättest, hättest du gesehen dass die Breiten nur ein Beispiel sind. Es geht nur um die Positionierung der beiden Spalten mit Float und Margin. Natürlich macht eine prozentuale Breite ohne min-width keinen Sinn.

    Was die Gliederung angeht kann ich hingegen nicht zustimmen, mittlerweile verfügen wir über die Mittel, die GLiederung im HTML sinnvol zu halten, damit sie auch ohne CSS oder mit einem Screenreader eine logische Abfolge hat und das CSS Design trotzdem genau so zu gestalten wie wir es uns wünschen. Eine Komplexe platzierung nehme ich ehrlich gesagt sehr viel lieber mit Position als mit Float vor.

  7. #7
    Meister(in)
    Registriert seit
    10.01.2008
    Ort
    Passau/Ösiland
    Beiträge
    267
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: divs anordnen

    Zitat Zitat von lukasn Beitrag anzeigen
    ...wenn du den ganzen Post gelesen hättest, hättest du gesehen dass die Breiten nur ein Beispiel sind. Es geht nur um die Positionierung der beiden Spalten mit Float und Margin. Natürlich macht eine prozentuale Breite ohne min-width keinen Sinn.
    doch hab ich!
    Der Fragesteller kennt sich nicht so gut aus, ist also offensichtlich Anfänger.
    Gerade deshalb
    ist dein Beispiel mit Float/Margin/Prozentbreiten für ihn nicht so gut geeignet.

    Außerdem ist es wg. der Stabilität eines Layouts immer besser, wenn die Spalten einen
    gemeinsamen Block Formatting Context bilden, was sie in deinem Fall nicht tun.

    Zitat Zitat von lukasn Beitrag anzeigen
    Was die Gliederung angeht kann ich hingegen nicht zustimmen, mittlerweile verfügen wir über die Mittel, die GLiederung im HTML sinnvol zu halten, damit sie auch ohne CSS oder mit einem Screenreader eine logische Abfolge hat und das CSS Design trotzdem genau so zu gestalten wie wir es uns wünschen.
    äh... ich hab nix von Gliederung gesagt?!
    Klar muss ein Markup auch mit abgeschalteten Gestaltungsanweisungen sinnvoll angeordnet sein, was sonst?!


    Zitat Zitat von lukasn Beitrag anzeigen
    Eine Komplexe platzierung nehme ich ehrlich gesagt sehr viel lieber mit Position als mit Float vor.
    Dann hast du den Float offensichtlich noch nicht so richtig verstanden.

Ähnliche Themen

  1. Divs anordnen
    Von derano im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 24.08.2007, 23:49
  2. divs anordnen
    Von 00eraser00 im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 14.08.2007, 15:30
  3. In den hintergrund anordnen
    Von Stefan_01 im Forum Flash Forum
    Antworten: 1
    Letzter Beitrag: 28.12.2006, 20:27
  4. Anordnen von Div-Holdern
    Von andras im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 25.06.2006, 21:48
  5. Fotos anordnen
    Von gast1 im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 3
    Letzter Beitrag: 25.08.2004, 16:16

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •