08.01.2004, 14:38
|
|||
|
|||
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//DE" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head><title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css"> <!--
html,body {
margin: 0px;
padding: 0px 1px 0 1px;
background-color: #FF9933;
color: #000000;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 101%;
text-align: center;
}
#frame {
margin-top: 50px;
width: 760px;
border: dotted thin;
text-align: left;
}
#spalte-a, #spalte-b, #spalte-c, #spalte-d, #spalte-e {
float: left;
width: 15%;
}
div.look {
margin: 2px 1px 0 1px;
border: 1px solid #000000;
padding: 5px;
background-color: #EECC99;
font-size: 0.7em;
}
-->
</style>
</head>
<body>
<div id="frame">
<div class="look">oben</div>
<div id="spalte-a">
<div class="look">spalte-a</div>
</div>
<div id="spalte-b">
<div class="look">spalte-b</div>
</div>
<div id="spalte-c">
<div class="look">spalte-c</div>
</div>
<div id="spalte-d">
<div class="look">spalte-d</div>
</div>
<div id="spalte-e">
<div class="look">spalte-e</div>
</div>
<br style="clear: left;"/>
<div class="look">unten</div>
</div>
</body></html>
Wichtig für das Verständnis  BOX-MODEL FLOAT-Bugs Hier im Forum alles schon 100mal diskutiert, und auch im css4you.de beschrieben. Wenn Du diese Dinge verstanden hast, geht alles (fast)
__________________
</ulle> 
|
| Sponsored Links |
|
08.01.2004, 18:06
|
|||
|
|||
|
Ich bins nochmal.
 Möchte die Spalte e (im Bild unten) in der freien Zeile haben, der Bereich unter Spalte b soll frei bleiben... leider rutscht mir e immer eine zeile zu tief  
|
|
09.01.2004, 11:11
|
|||
|
|||
|
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//DE" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head><title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css"> <!--
html,body {
margin: 0px;
padding: 0px 1px 0 1px;
background-color: #FF9933;
color: #000000;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 101%;
text-align: center;
}
#frame {
margin-top: 50px;
width: 760px;
border: dotted thin;
text-align: left;
}
#spalte-a, #spalte-b, #spalte-c {
padding: 0 0 3px 0;
float: left;
width: 20%;
}
#spalte-b {
width: 60%;
}
div.look {
margin: 2px 1px 0 1px;
border: 1px solid #000000;
padding: 5px;
background-color: #EECC99;
font-size: 0.7em;
}
-->
</style>
</head>
<body>
<div id="frame">
<div class="look">oben</div>
<div id="spalte-a">
<div class="look">spalte-a</div>
<div class="look">spalte-a</div>
<div class="look">spalte-a</div>
<div class="look">spalte-a
spalte-a
spalte-a
spalte-a
spalte-a
spalte-a
spalte-a
spalte-a
spalte-a
</div>
<div class="look">spalte-a</div>
<div class="look">spalte-a</div>
<div class="look">spalte-a</div>
</div>
<div id="spalte-b">
<div class="look">spalte-b</div>
<div class="look">Auch spalte-b mit viel Content
</div>
</div>
<div id="spalte-c">
<div class="look">spalte-c</div>
<div class="look">spalte-c</div>
<div class="look">spalte-c</div>
<div class="look">spalte-c
spalte-c
spalte-c
spalte-c
spalte-c
spalte-c</div>
<div class="look">spalte-c</div>
</div>
<br style="clear: left;"/>
<div class="look">unten</div>
</div>
</body></html>
 Nachmal die 3 Spalten sind ja nicht sichtbar, Du siehst jeweils die Inhalte in Form der CLASS Look. Um es zu verstehen kannst Du ja mal Hintergrundfarbe einsetzen...
__________________
</ulle>
|
|
09.01.2004, 11:50
|
|||
|
|||
|
Das mit den 5-spaltigem habe ich kapiert...
Dein Beispiel ist perfekt -hilft mir sehr weiter (besonders vom Verständnis). - ich stand ein bisschen auf der Leitung. Merci Gruß Simon
|
|
09.01.2004, 12:02
|
|||
|
|||
 http://www.xhtmlforum.de/viewtopic.php?t=702Das kannst Du Dir auch mal ansehen. Des weiteren gibt es hier eine Suchfunktion, leider gab es mal tech. Problem im Forum, deshalb findest Du damit keine alten Einträge. Aber wenn Du Dir die Zeit nimmst, dieses Forum eine wenig zurück zu verfolgen, sind ja erst 5 Seiten, wirst Du eine Menge zum Thema finden. Wichtig sind die tücken bei FLOAT und BOX-Model. Noch ein Workaround http://www.webwriting.de/sogehts/css...al/tutalle.htm
__________________
</ulle>
|
 |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| CSS - CMS - lange Menus Balken/BG oben? | shinobi | CSS | 3 | 13.10.2011 21:12 |
| Div neben zentrierten DIV | homerunjack | CSS | 3 | 30.09.2011 15:30 |
| Div Layout, variable Div-Größe IE6 | bw | CSS | 2 | 17.08.2007 11:32 |
| Layout Problem mit div box | powerpika | CSS | 8 | 16.12.2006 12:36 |
| Probleme mit Div Layout | Laiwan | CSS | 4 | 29.08.2005 17:10 |
Linear-Darstellung
