mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Fr 19.04.2024 06:11 Benutzername: Passwort: Auto-Login

Thema: [hilfe] DIV layout vom 26.07.2004


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> [hilfe] DIV layout
Seite: 1, 2  Weiter
Autor Nachricht
gtz
Threadersteller

Dabei seit: 15.04.2002
Ort: -
Alter: 48
Geschlecht: Männlich
Verfasst Mo 26.07.2004 16:16
Titel

[hilfe] DIV layout

 Antworten mit Zitat Zum Seitenanfang
hossa.
ich versuche, folgendes layout mit divs umzusetzen, aber bin kläglich gescheitert:




den code dazu hatte ich mir im groben so vorgestellt:

Code:

<div class="outer">

  <div class="rosa_und_blau" style="width:100%">
    <div class="rosa" style="width:100%; height: 100%"; float: left;">
      whatever
    </div>
    <div class="blau" style="width:254px; height: 100%"; float: right;">
      whatever
    </div>
  </div>

  <div class="gruen" style="width:100%">
    whatever
  </div>

  <div class="gelb_und_rot" style="width:100%">
    <div class="gelb" style="width:100%; height: 100%"; float: left;">
      whatever
    </div>
    <div class="rot" style="width:254px; height: 100%"; float: right;">
      whatever
    </div>
  </div>

</div>


die höhe der gelb_und_rot soll durch die höhe von gelb oder rot bestimmt werden, je nachdem,welches höher is. rosa_und_blau analog dazu.

kann mir jemand von euch da unter die arme greifen? ich kriegs nich geregelt.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
matt

Dabei seit: 06.05.2003
Ort: Köln
Alter: 43
Geschlecht: Männlich
Verfasst Mo 26.07.2004 16:20
Titel

Antworten mit Zitat Zum Seitenanfang
Mit der Höhe das ist immer so eine Sache.

Wie soll denn der Hintergrund der DIVS sein? Man könnte den nebeneinanderliegenden einfach dasselbe Hintergrundbild mit der ganzen Breite geben und den Contentbereich mit PADDING auf den gewünschten Platz beschränken. Dann sollten beide gleich hoch aussehen. Wenn die allerdings einen BORDER haben sollen geht's so nicht.
  View user's profile Private Nachricht senden
Anzeige
Anzeige
gtz
Threadersteller

Dabei seit: 15.04.2002
Ort: -
Alter: 48
Geschlecht: Männlich
Verfasst Mo 26.07.2004 16:24
Titel

Antworten mit Zitat Zum Seitenanfang
so einfach is das nich, denn die höhe der einzelnen div (mit ausnahme des grünen) wird erst zur laufzeit durch die höhe des inhaltes bestimmt.

aber ich hab grade ne idee...
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
p.ro

Dabei seit: 21.05.2004
Ort: bochum
Alter: 54
Geschlecht: Männlich
Verfasst Mi 28.07.2004 08:35
Titel

Antworten mit Zitat Zum Seitenanfang
gtz hat geschrieben:
... aber ich hab grade ne idee...


Und? Hat`s geklappt?
  View user's profile Private Nachricht senden
Account gelöscht


Ort: -
Alter: -
Verfasst Mi 28.07.2004 08:49
Titel

Antworten mit Zitat Zum Seitenanfang
Vielleicht kann dir das hier beispielhaft weiterhelfen (Spukte noch in meinen Bookmarks rum).

http://www.pixy.cz/blogg/clanky/css-3col-layout/
 
Blumenwiese

Dabei seit: 04.07.2004
Ort: Darmstadt
Alter: -
Geschlecht: -
Verfasst Mi 28.07.2004 09:11
Titel

Antworten mit Zitat Zum Seitenanfang
machs doch mit css. kannste den overflow controllieren.
und jeweils ne area erstellen --> hier würd ich id anstatt class nehmen.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Account gelöscht


Ort: -
Alter: -
Verfasst Mi 28.07.2004 09:14
Titel

Antworten mit Zitat Zum Seitenanfang
Das IST CSS *zwinker*
 
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: Männlich
Verfasst Mi 28.07.2004 09:36
Titel

Antworten mit Zitat Zum Seitenanfang
Code:
<HTML>
  <HEAD>
    <TITLE>test</TITLE>
  </HEAD>
  <STYLE TYPE="text/css">
  body {
     margin: 0;
     padding: 0;
     height: 100%;
     }
  .topcontainer {
     width: 100%;
     background-color: #387623;
   }
  .topleft {
    float: left;
     width: 100%;
     right: 294px;
     margin-right: -294px;
    background-color: #349764;
     }
  .topright {
     float: right;
   width: 294px;
   background-color: #765498;
   right: 0;
   }
  .bottomcontainer {
     width: 100%;
     height: 100%;
     background-color: #387623;
   }
  .bottomleft {
    float: left;
     width: 100%;
     height: 100%;
     right: 294px;
     margin-right: -294px;
    background-color: #349764;
     }
  .bottomright {
     float: right;
   width: 294px;
   background-color: #765498;
   right: 0;
   height: 100%;
   }
   .clear {
   clear: both;
   margin: 0;
   padding: 0;
   line-height: 1px;
   font-size: 1px;
   }
  </STYLE>
  <BODY>
<DIV CLASS="topcontainer">
   <DIV CLASS="topleft">
      content oben

   </DIV>
            <DIV CLASS="topright">
            content oben rechts   
         </DIV>
</DIV>
<DIV CLASS="clearer">&nbsp;</DIV>
<DIV CLASS="bottomcontainer">
   <DIV CLASS="bottomleft">
      content unten links

   </DIV>
            <DIV CLASS="bottomright">
            content unten rechts   
         </DIV>
</DIV>DIV>
</DIV> 

</BODY></HTML>



Blumenwiese hat geschrieben:
machs doch mit css. kannste den overflow controllieren.
und jeweils ne area erstellen --> hier würd ich id anstatt class nehmen.

total sinentleert und in etwa so hilfreich, wie wenn jemand sagt "da musst du noch was an der typo machen"

€: achso.. ist getestet im firefox 0.9.2 und IE 5.5, NS6 und NS7 auf PC.. Opera 7 zerlegts leider etwas (das clearer div ist da riesig.. müsstest du evtl. noch etwas rumschrauben)

Zuletzt bearbeitet von sahnemuh am Mi 28.07.2004 10:04, insgesamt 3-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen Website mit festen Layout in dynamisches Layout umbauen
[CSS Layout] An Fenstergröße anpassendes Layout
Probleme mit Layout - div im layout height="100%"
css layout
Layout .PSD zu CMS
CSS Layout
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB