Kleines Tabellenproblem

entireInsane · 05/03/2012, 14:42

Hi Leute

Ich habe ein kleines Problem beim Erstellen meiner Homepage.

Grob gesagt, besteht die HP aus zwei großen Tabellen.

Die erste Tabelle ist der Head, also an TOP angeklebt.

Die zweite Tabelle ist der Food, also an BOT angeklebt.

Jetzt möchte ich eine dritte Tabelle erstellen welche den Raum zwischen den beiden Haupttabellen individuell füllt.

Sprich, wenn Kunden die Homepage mit unterschiedlichem Zoom oder Auflösung anschauen, immer die dritte Tabelle den Raum schön ausfüllt.

Verständlich was ich suche?

Per Google hab ich leider wenig gefunden, bzw verstehe ich das alles nicht so recht.

Ich arbeite mit Dreamweaver, hab eine PHP Datei.

Bastel mir meine Homepage aus einzelnen Codes zusammen, aber dafür finde ich einfach nichts.

Bitte um Hilfe.

MFG

.Marcel' · 05/03/2012, 15:11

Arbeite mit Div's, Tabellen sind veraltet.

boxxiebabee · 05/03/2012, 15:13

^This.

Hier mal für Divs:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<style type="text/css">
body {
	height:100%;
	margin: 0px;
	padding: 0px;
}

#content {
	display:block;
	position:fixed;
	width:100%;
	height:100%;
	background-color:#6C6;
}

#header {
	height: 150px;
	width: 100%;
        position: relative;
	background-color:#33CCFF;
}

#footer {
	height: 150px;
	width: 100%;
	background-color:#3399FF;
        position: absolute;
        bottom: 0;
}
</style>
<body>
<div id="header">HEADER</div>
<div id="content">CONTENT</div>
<div id="footer">FOOTER</div>
</body>
</html>

entireInsane · 05/03/2012, 15:23

Ja habe ich mir auch schon gedacht. Aber wie kann ich das mit Divs verwirklichen?

.Marcel' · 05/03/2012, 15:24

Quote:

Originally Posted by boxxiebabee

^This.

Hier mal für Divs:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<style type="text/css">
body {
	height:100%;
	margin: 0px;
	padding: 0px;
}

#content {
	display:block;
	position:fixed;
	width:100%;
	height:100%;
	background-color:#6C6;
}

#header {
	height: 150px;
	width: 100%;
        position: relative;
	background-color:#33CCFF;
}

#footer {
	height: 150px;
	width: 100%;
	background-color:#3399FF;
        position: absolute;
        bottom: 0;
}
</style>
<body>
<div id="header">HEADER</div>
<div id="content">CONTENT</div>
<div id="footer">FOOTER</div>
</body>
</html>

Aber bitte in eine extra .css Datei, und nicht in die .html datei.
Das ist Ordentlicher, und Übersichtlich.

entireInsane · 05/03/2012, 15:27

Ok. und die Noob Frage schlechthin.

Wie mach ich die .css Datei und wie verbinde ich das dann mit der html Datei?

NotEnoughForYou · 05/03/2012, 15:33

einfach als .css speichern und mit link rel im head tag einbinden

entireInsane · 05/03/2012, 15:54

Jetzt habe ich es geschafft, dass meine mittlere Tabelle als "content" festgelegt ist.

Doch ich kann das Div NICHT zentrieren.

Wie geht das???

Ich schaffs einfach nicht, dass Div zu zentrieren. Zum Verzweifeln

マルコ · 05/03/2012, 17:20

Quote:

Originally Posted by .Marcel'

Arbeite mit Div's, Tabellen sind veraltet.

Das stimmt so absolut nicht. Tabellen sind ein sehr wichtiger Bestandteil einer Homepage, insbesondere, wenn man Inhalte nebeneinander anzeigen will.
Wer sich schonmal mit PROFESSIONELLEN HP DESIGNERN (also Leute, die damit ihr täglich Brot verdienen) darüber unterhalten hat, weiß das. Denn es gibt heute noch genug User, die alte Browser, bzw. IE nutzen. Damit eine HP überall gleich aussieht, muss man Tabellen verwenden, da DIVs in älteren Browsern und IE gern falsch positioniert werden.

@boxxiebabee: Wieso XHTML? Wieso nicht HTML5?

DIV zentrieren geht mit

Code:

margin: auto;

boxxiebabee · 05/03/2012, 17:48

Quote:
Originally Posted by minecrawler
Das stimmt so absolut nicht. Tabellen sind ein sehr wichtiger Bestandteil einer Homepage, insbesondere, wenn man Inhalte nebeneinander anzeigen will.
Wer sich schonmal mit PROFESSIONELLEN HP DESIGNERN (also Leute, die damit ihr täglich Brot verdienen) darüber unterhalten hat, weiß das. Denn es gibt heute noch genug User, die alte Browser, bzw. IE nutzen. Damit eine HP überall gleich aussieht, muss man Tabellen verwenden, da DIVs in älteren Browsern und IE gern falsch positioniert werden.

@boxxiebabee: Wieso XHTML? Wieso nicht HTML5?

DIV zentrieren geht mit
Code:
margin: [B]0[/B] auto;

Es war nur ein schnelles Beispiel, hab direkt den Doctype von Dreamweaver übernommen.
Ich benutze Tabellen eig. nur für Formen & Listen. Sonst würde mir jetzt kein Grund einfallen warum ich die sonst verwenden sollte. Und ich verdien damit mein täglich Brot.

Damit's in älteren / anderen Browsern gleich aussieht kann man ja verschiedene Stylesheets benutzen.

.Marcel' · 05/03/2012, 17:51

Quote:
Originally Posted by minecrawler
Das stimmt so absolut nicht. Tabellen sind ein sehr wichtiger Bestandteil einer Homepage, insbesondere, wenn man Inhalte nebeneinander anzeigen will.
Wer sich schonmal mit PROFESSIONELLEN HP DESIGNERN (also Leute, die damit ihr täglich Brot verdienen) darüber unterhalten hat, weiß das. Denn es gibt heute noch genug User, die alte Browser, bzw. IE nutzen. Damit eine HP überall gleich aussieht, muss man Tabellen verwenden, da DIVs in älteren Browsern und IE gern falsch positioniert werden.

@boxxiebabee: Wieso XHTML? Wieso nicht HTML5?

DIV zentrieren geht mit
Code:
margin: auto;

Sry aber wenn man IE -1 aus dem 10. Jahrhundert nutzt, ist man selbst dran schuld, man sollte halt darauf achten, alles aktuell zu halten..
Da sind mir die "Besucher" mit einem Steinzeit Browser egal.

NotEnoughForYou · 05/03/2012, 18:02

Quote:
Originally Posted by minecrawler
Das stimmt so absolut nicht. Tabellen sind ein sehr wichtiger Bestandteil einer Homepage, insbesondere, wenn man Inhalte nebeneinander anzeigen will.
Wer sich schonmal mit PROFESSIONELLEN HP DESIGNERN (also Leute, die damit ihr täglich Brot verdienen) darüber unterhalten hat, weiß das. Denn es gibt heute noch genug User, die alte Browser, bzw. IE nutzen. Damit eine HP überall gleich aussieht, muss man Tabellen verwenden, da DIVs in älteren Browsern und IE gern falsch positioniert werden.

@boxxiebabee: Wieso XHTML? Wieso nicht HTML5?

DIV zentrieren geht mit
Code:
margin: auto;

Wenn du auf diese Weise argumentierst, wieso bist du dann ein so großer Fan von HTML5 ? Auch wenn es dir in den Threads die ich gesehen hab immer nur um die Syntax ging, wenn der Browser kein HTML5 unterstützt, man aber HTML5 Elementer verwendet, bekommt man ein Problem.

entireInsane · 05/03/2012, 18:13

Also möchte eure Diskussion ungern unterbrechen aber habe ein Problem.

Mein DIV möchte mit marin: auto; nicht zentriert sein

Genausowenig mit left:50%; righ:50%; oder sonst etwas.

Auszug aus meinem Code.

#content {
position:fixed;
margin:auto;
height:100%;

}

<div id="content" style="width:1012; background-color:#e5e7ea;">

</div>

entweder der DIV ist ganz links, oder ganz rechts, oder er geht über den Footer hinaus.

Kein Plan. Bitte um Hilfe

NotEnoughForYou · 05/03/2012, 19:35

dein div braucht eine feste weiter um zentriert zu werden -->

HTML Code:

#content {
margin:auto; // damit sitzt es sowohl vertikal als auch horizontal mittig
width:800px;
height:100%;
}

lass das position:fixed weg, ich glaube kaum, dass du den effekt willst, den position:fixed erzielt.

マルコ · 05/03/2012, 23:14

Quote:

Originally Posted by boxxiebabee

Damit's in älteren / anderen Browsern gleich aussieht kann man ja verschiedene Stylesheets benutzen.

Lieber 2 Stylesheets maintainen, als das einmal ordentlich mit ner unsichtbaren Table, so dass es nachher exakt gleich aussieht? Und nur 1 Stylesheet? Was ist wohl angenehmer? hmmmmmm.

Quote:

Originally Posted by .Marcel'

Sry aber wenn man IE -1 aus dem 10. Jahrhundert nutzt, ist man selbst dran schuld, man sollte halt darauf achten, alles aktuell zu halten..
Da sind mir die "Besucher" mit einem Steinzeit Browser egal.

Du verdienst damit ja kein Geld. Aber pass auf, mit der Haltung verlierst du Kunden und damit Geld. Jeder Arbeitgeber/Kunde wird dir für so ne Aussage auf die Pfoten hauen und sich überlegen, nicht nen anderen Webdesigner zu beauftragen. Kompatibilität sollte wenigstens alle gängigen Browser + 2-3 ältere Versionen beinhalten.

Quote:

Originally Posted by NotEnoughForYou

Wenn du auf diese Weise argumentierst, wieso bist du dann ein so großer Fan von HTML5 ? Auch wenn es dir in den Threads die ich gesehen hab immer nur um die Syntax ging, wenn der Browser kein HTML5 unterstützt, man aber HTML5 Elementer verwendet, bekommt man ein Problem.

HTML5 wird, solange man Tags verwendet, die auch in HTML4 enthalten sind, vollkommen richtig angezeigt. Und welche Tags, die neu dazu gekommen sind, sind wirklich ausschlaggebend für den Seitenaufbau? Runde Ecken? Gradients? Videos? Sockets? Alles nein. Und im Normalfall hat man bei Elementen wie Videos immer noch eine Alternative, z.B. Flash.

Falls sonst noch wer anderer Meinung ist, scheut euch nicht, mir ins Profil zu schreiben, dort können wir nach Herzens Lust diskutieren ohne OT zu werden