zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden 3-spalten-layout --> boxen nebeneinander positionieren

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 03.01.2006, 11:56
Benutzerbild von nevermind
Trollflüsterer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.08.2005
Ort: Bietigheim-Bissingen
Beiträge: 2.215
nevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblick
Standard 3-spalten-layout --> boxen nebeneinander positionieren

hi,

meine frage ist:

warum sind die boxen (alle height: 100%) nicht nebeneinander angeordnet trotz float:left;. Was fehlt da ?

mein code:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>jk</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">
* {margin:0; padding:0;}
html, body, #container, #left, #right, #center {height:100%;}
body { background:#ffffff; font-size:100,01%; text-align: center; }

#container {
	background: yellow;
	min-height: 100%;
	text-align: left;
	width: 1000px;
	margin: 0 auto;
}

#left {
	min-height: 100%;
	float: left;
	width: 200px;
	background: #A03F59;
	overflow: hidden;
	border: 1px solid #cccccc;
}

#center {
	min-height: 100%;
	background: #4A518F;
	border: 1px solid #cccccc;
	float: left;
	width: 500px;
	overflow: hidden;
}

#right {
	min-height: 100%;
	float: right;
	width: 200px;
	background: #A03F59;
	overflow: hidden;
	border: 1px solid #cccccc;
}
</style>

</head>

<body>

<div id="container">
<div id="left">
begin

check

check

check

check

check

check

check

check

check

end</div>

<div id="center">
begin

check

check

check

check

check

check

check

check

check

end</div>

<div id="right">
begin

check

check

check

check

check

check

check

check

check

end</div>
</div>

</body>
</html>
__________________
Gruß Roman // ngkreativ.de - Webdesign & Motorradumbau
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 03.01.2006, 12:19
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard Re: 3-spalten-layout --> boxen nebeneinander positioniere

Zitat:
Zitat von MetaCrawler
warum sind die boxen (alle height: 100%) nicht nebeneinander angeordnet trotz float:left;.
Weil die Breite nicht ausreicht. Informiere dich über das Boxmodell!

Zitat:
Was fehlt da ?
Ein ";".

Was ist "float-left"?

Validiere dein Stylesheet.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 03.01.2006, 12:30
Benutzerbild von nevermind
Trollflüsterer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.08.2005
Ort: Bietigheim-Bissingen
Beiträge: 2.215
nevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblick
Standard

so, die breite reicht jetzt theoretisch aus (container: width: 1000px, egal ob der IE jetzt das boxmodell falsch interpretiert oder nicht. es passt leider immer noch nicht. habe ich etwas übersehen ?

btw. ein fehlendes ";" kann ich leider nicht erkennen.
float-left heißt natürlich float:left....blöder fehler...

ansonsten hat nur beim "meta" das "/" am ende gefehlt. jetzt ist es valide nach "validome"
__________________
Gruß Roman // ngkreativ.de - Webdesign & Motorradumbau
Mit Zitat antworten
  #4 (permalink)  
Alt 03.01.2006, 12:32
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Validiere dein Stylesheet!
Mit Zitat antworten
  #5 (permalink)  
Alt 03.01.2006, 12:35
Benutzerbild von nevermind
Trollflüsterer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.08.2005
Ort: Bietigheim-Bissingen
Beiträge: 2.215
nevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblick
Standard

och nö, ich dachte validome findet solche sachen........oje

naja danke, es tut


edit: welche eigenschaft bestimmt, dass die site im IE und firefox gleichermaßen etwas größer ist als 100% (scrollbalken).

ist das wieder einmal unverständnis des boxmodells meinerseits, oder was sonst ?

edit2: quelltext oben aktualisiert
__________________
Gruß Roman // ngkreativ.de - Webdesign & Motorradumbau
Mit Zitat antworten
  #6 (permalink)  
Alt 03.01.2006, 12:45
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von MetaCrawler
....
edit: welche eigenschaft bestimmt, dass die site im IE und firefox gleichermaßen etwas größer ist als 100% (scrollbalken).

ist das wieder einmal unverständnis des boxmodells meinerseits, oder was sonst ?
......
http://www.xhtmlforum.de/viewtopic.php?p=24301#24301
__________________
</ulle>
Mit Zitat antworten
  #7 (permalink)  
Alt 03.01.2006, 12:48
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

http://www.xhtmlforum.de/viewtopic.php?p=44810#44810
__________________
</ulle>
Mit Zitat antworten
  #8 (permalink)  
Alt 03.01.2006, 12:57
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

@metacrawler:
ich möchte mich IChao (aus einem anderen Thread) anschließen:
Zitat:
Zitat von IChao
Wenn du CSS benutzen willst, müsstest du es lernen. Im Forum kann man zwar Details besprechen, aber es kann kein Fernkurs sein, in dem dich Tutoren von absolute bis z-index begleiten.
Mit Zitat antworten
  #9 (permalink)  
Alt 03.01.2006, 13:01
Benutzerbild von nevermind
Trollflüsterer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.08.2005
Ort: Bietigheim-Bissingen
Beiträge: 2.215
nevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblicknevermind ist ein Lichtblick
Standard

hm, ich habe jetzt alle border rausgenommen. es geht

gut.....es werden ja noch andere elemente in den containern links/rechts/center positioniert, dann gebe ich denen einfach die gewünschte border.

oder gibt es eine möglichkeit, dass bei height border nicht mitgezählt wird. (100% und auto verhalten sich ja gleich)



hm, könnte man theoretisch nicht den div id="container" ganz weglassen und die boxen links / rechts um die box center positionieren ?


edit: ja stimmt @fricca. heute ist endlich das buch "css-praxis" gekommen. ich hoffe, ich muss euch dann nicht mehr mit meinen immer-gleichen fragen belasten
__________________
Gruß Roman // ngkreativ.de - Webdesign & Motorradumbau
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 03.01.2006, 13:08
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von MetaCrawler
...
(100% und auto verhalten sich ja gleich)
...
Nein, steht ja auch in den beiden Links beschrieben !!!
__________________
</ulle>
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
3 Spalten Layout: Schrift läuft in andere Boxen nauen CSS 7 05.12.2011 15:39
CSS 3 Spalten Layout mit float --> Umbruch verhindern der_die_das CSS 1 27.10.2009 06:57
2 CSS Boxen nebeneinander positionieren -seppel- CSS 3 25.06.2008 00:45
zweispalitiges layout -> alle boxen gleich kakktus CSS 0 17.01.2008 17:43
Vertikales Layout - Floats - 2 Boxen nebeneinander grischa_sgd CSS 4 25.09.2007 15:55


Alle Zeitangaben in WEZ +2. Es ist jetzt 08:43 Uhr.