Div oder Table

rbs_phoenix · 04.06.2008, 08:36

Also ich hab quasi einen "Auftrag" einer Freundin, eine Simple Seite zu machen. Header, Links Menü, Rechts davon der Inhalt und Footer.

Jetzt meine Frage: Macht man die Aufteilung am besten mit <div> mit evtl css oder mit Tabellen?? Oder vielleicht sogar beides??

Mit div hab ich die Erfahrung gemacht (oder auch bei anderen Pages gesehen), dass es manchmal bei FireFox nicht funktioniert, wobei andere auch gesagt haben, dass mit <table> es unübersichtlich oder "Noob-Like", also nichts Halbes und nichts Ganzes ist.

Flor1an · 04.06.2008, 08:57

Das wäre eine einfache und gute Möglichkeit DIV Container und CSS einzusetzen!

Der HTML Code sieht denkbar einfach aus.

Code:

<div id="header"></div>
<div id="content"></div>
<div id="sidebar"></div>
<div id="footer"></div>

Und mit CSS musst du dir dann eben etwas zusammen basteln. In "content" und "sidebar" musst du dann "float: left/right" angeben und dann noch nen paar Höhen/Breiten angaben und schon bist du fertig.

rbs_phoenix · 04.06.2008, 09:18

ja aber wie gesagt.. mit table ist es auch nicht viel schwieriger:

Code:

header
<table>
<tr>
<td>Menü</td>
<td>Content</td>
<td>sidebar</td>
<tr>
footer
</table>

und wie gesagt der unterschied bei IE und FF.

Flor1an · 04.06.2008, 09:24

<div> Funktionieren super beim FF! Und Tabellen sind nicht dafür gedacht Inhalte zu positionieren!

Angenommen du möchtest irgendwann mal dein Design ändern, musst du alle Tabellen anpassen etc. Beim <divs> musst du nur in der CSS Datei die Höhen/Breitenangaben ändern und vielleicht die floats von links auf rechts setzen wenn du das Menü wo anders haben möchtest.

Außerdem kannst du so verschiedene CSS Dateien erstellen die für bestimmte Medien genutzt werden (PC, Handheld, Handy, Printer). Das hat den Vorteil dass du z.B. fürs Drucken die Sidebar und das Menü ausblenden lassen kannst.

rbs_phoenix · 04.06.2008, 09:37

dann hab ich noch 2 Fragen zu den Divs. Hab die noch nicht soo oft angewendet.
1. Wie kann man die ausblenden (schätze mal JS)
2. kann man es Einstellen, dass wenn man eine Feste höhe und breite hat, diese nicht überschritten werden?? Ich hatte mal eine Div-Box mit festen Maßen, wo der Text aber zu lang war, dass er reinpassen würde. Also ist er quasi übergelappt und stand auf nem anderen Text, der darunter war. So dass dort nen Scrollbalken ist, oder der Text einfach nicht angezeigt wird, dass kein durcheinander kommt?? (Hoffe du weißt was ich meine^^)

Flor1an · 04.06.2008, 09:48

1. Ausblenden kannst du ihn entweder indem du im Stylesheet die DIV Box ausblendest.

Code:

#sidebar {
    visibility: hidden;
}

oder du machst es eben mit JS dann kannst du die Box zur Laufzeit ausblenden bzw. auch wieder einblenden lassen, kannst du sogar per Link oder Button triggern.

2. normal werden Texte ja am Ende einer DIV Box umgebrochen. Das Problem was du schilderst ist wenn du ein einziges Wort hast (ohne Leerzeichen) das eben extrem lang ist. Wenn wieder irgendwer loooooooo...oooooooool schreibt ...

Zum einen könnte man in PHP so lange Wörter filtern bzw. kürzen. Aber es gibt in CSS die Möglichkeit entweder Wörter die so lange sind abzuschneiden, also alles was nicht mehr auf die Seite passt ist einfach weg, nächstes Wort kommt aber in der nächsten Zeile wieder. Oder man kann einstellen dass gescrollt werden kann.

Das funktioniert über die CSS Eigentschaft "overflow" die "hidden" oder "scroll" sein kann. Standard ist "visible" wobei hier der Text über die DIV Box hinaus angezeigt wird.

rbs_phoenix · 04.06.2008, 10:06

Achso ok danke^^.. dann bräuchte ich nur den JS-Befehl zum togglen und ich bin rundum zufrieden^^

Flor1an · 04.06.2008, 10:15

Ich dachte es geht dir eigentlich nur ums Design?

Die DIV Box zum ein/ausblenden.

Code:

<div id="versteck_mich"></div>

Die HTML Links könnten so aussehen, kannst du natürlich auch mit Buttons machen oder sowas.

Code:

DIV einblenden
DIV ausblenden

Und das JavaScript sieht dann so aus.

Code:

function div_show (box_id) {
    document.getElementById(box_id).style.visibility = 'visible';
}

function div_hide (box_id) {
    document.getElementById(box_id).style.visibility = 'hidden';
}

Aber das JavaScript lässt sich auch recht schnell mit google finden

rbs_phoenix · 04.06.2008, 10:57

Jo geht.. Dankeschön!!

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
PHP/MySQL: QCodo's Code-Generator	Zergling-new	Tutorials	2	09.05.2008 05:33
Import von innoDB-Tabellen, #1005 - Can't create table	Zergling-new	Datenbanken	0	30.07.2007 10:49
Parsen von Delimitern	Basti	Tutorials	0	30.09.2006 21:24
Truncate table		Datenbanken	5	20.01.2006 09:47
create table statement wird doppelt abgesetzt		PHP Tipps 2007	6	18.11.2005 14:48
[mysql] Table Design bei grossen Datenmengen		Datenbanken	5	02.10.2005 13:25
[Erledigt] Problem mit mySQL		Datenbanken	7	27.09.2005 12:06
PHP-Fehlermeldung, weiss nicht mehr weiter		PHP Tipps 2005-2	12	21.09.2005 12:56
wie mit ph ein Table erzeugen		PHP Tipps 2005-2	14	22.07.2005 11:32
mysql dump einspielen (ohne phpmyadmin)		PHP Tipps 2005-2	6	18.06.2005 21:50
MYSLQ CREATE TABLE PROBLEM		PHP Tipps 2004-2	5	17.11.2004 00:23
table mit inputs hinzufuegen		PHP Tipps 2004	9	29.08.2004 17:33
HILFE: Column count doesn't match value count at row 1		Datenbanken	17	12.06.2004 16:45
[Erledigt] table eintrag grösse		Datenbanken	5	05.06.2004 02:07

04.06.2008, 08:36
rbs_phoenix Erfahrener Benutzer Registriert seit: 03.11.2004 Beiträge: 289	Div oder Table Also ich hab quasi einen "Auftrag" einer Freundin, eine Simple Seite zu machen. Header, Links Menü, Rechts davon der Inhalt und Footer. Jetzt meine Frage: Macht man die Aufteilung am besten mit <div> mit evtl css oder mit Tabellen?? Oder vielleicht sogar beides?? Mit div hab ich die Erfahrung gemacht (oder auch bei anderen Pages gesehen), dass es manchmal bei FireFox nicht funktioniert, wobei andere auch gesagt haben, dass mit <table> es unübersichtlich oder "Noob-Like", also nichts Halbes und nichts Ganzes ist. __________________ Homepage: http://www.rbs-page.de


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

04.06.2008, 08:57
Flor1an da schreibt der ElePHPant Registriert seit: 18.06.2008 Beiträge: 8.903 PHP-Kenntnisse: Fortgeschritten	Das wäre eine einfache und gute Möglichkeit DIV Container und CSS einzusetzen! Der HTML Code sieht denkbar einfach aus. Code: <div id="header"></div> <div id="content"></div> <div id="sidebar"></div> <div id="footer"></div> Und mit CSS musst du dir dann eben etwas zusammen basteln. In "content" und "sidebar" musst du dann "float: left/right" angeben und dann noch nen paar Höhen/Breiten angaben und schon bist du fertig.

04.06.2008, 09:18
rbs_phoenix Erfahrener Benutzer Registriert seit: 03.11.2004 Beiträge: 289	ja aber wie gesagt.. mit table ist es auch nicht viel schwieriger: Code: header <table> <tr> <td>Menü</td> <td>Content</td> <td>sidebar</td> <tr> footer </table> und wie gesagt der unterschied bei IE und FF. __________________ Homepage: http://www.rbs-page.de

04.06.2008, 09:24
Flor1an da schreibt der ElePHPant Registriert seit: 18.06.2008 Beiträge: 8.903 PHP-Kenntnisse: Fortgeschritten	<div> Funktionieren super beim FF! Und Tabellen sind nicht dafür gedacht Inhalte zu positionieren! Angenommen du möchtest irgendwann mal dein Design ändern, musst du alle Tabellen anpassen etc. Beim <divs> musst du nur in der CSS Datei die Höhen/Breitenangaben ändern und vielleicht die floats von links auf rechts setzen wenn du das Menü wo anders haben möchtest. Außerdem kannst du so verschiedene CSS Dateien erstellen die für bestimmte Medien genutzt werden (PC, Handheld, Handy, Printer). Das hat den Vorteil dass du z.B. fürs Drucken die Sidebar und das Menü ausblenden lassen kannst.

04.06.2008, 09:37
rbs_phoenix Erfahrener Benutzer Registriert seit: 03.11.2004 Beiträge: 289	dann hab ich noch 2 Fragen zu den Divs. Hab die noch nicht soo oft angewendet. 1. Wie kann man die ausblenden (schätze mal JS) 2. kann man es Einstellen, dass wenn man eine Feste höhe und breite hat, diese nicht überschritten werden?? Ich hatte mal eine Div-Box mit festen Maßen, wo der Text aber zu lang war, dass er reinpassen würde. Also ist er quasi übergelappt und stand auf nem anderen Text, der darunter war. So dass dort nen Scrollbalken ist, oder der Text einfach nicht angezeigt wird, dass kein durcheinander kommt?? (Hoffe du weißt was ich meine^^) __________________ Homepage: http://www.rbs-page.de

04.06.2008, 09:48
Flor1an da schreibt der ElePHPant Registriert seit: 18.06.2008 Beiträge: 8.903 PHP-Kenntnisse: Fortgeschritten	1. Ausblenden kannst du ihn entweder indem du im Stylesheet die DIV Box ausblendest. Code: #sidebar { visibility: hidden; } oder du machst es eben mit JS dann kannst du die Box zur Laufzeit ausblenden bzw. auch wieder einblenden lassen, kannst du sogar per Link oder Button triggern. 2. normal werden Texte ja am Ende einer DIV Box umgebrochen. Das Problem was du schilderst ist wenn du ein einziges Wort hast (ohne Leerzeichen) das eben extrem lang ist. Wenn wieder irgendwer loooooooo...oooooooool schreibt ... Zum einen könnte man in PHP so lange Wörter filtern bzw. kürzen. Aber es gibt in CSS die Möglichkeit entweder Wörter die so lange sind abzuschneiden, also alles was nicht mehr auf die Seite passt ist einfach weg, nächstes Wort kommt aber in der nächsten Zeile wieder. Oder man kann einstellen dass gescrollt werden kann. Das funktioniert über die CSS Eigentschaft "overflow" die "hidden" oder "scroll" sein kann. Standard ist "visible" wobei hier der Text über die DIV Box hinaus angezeigt wird.

04.06.2008, 10:06
rbs_phoenix Erfahrener Benutzer Registriert seit: 03.11.2004 Beiträge: 289	Achso ok danke^^.. dann bräuchte ich nur den JS-Befehl zum togglen und ich bin rundum zufrieden^^ __________________ Homepage: http://www.rbs-page.de

04.06.2008, 10:15
Flor1an da schreibt der ElePHPant Registriert seit: 18.06.2008 Beiträge: 8.903 PHP-Kenntnisse: Fortgeschritten	Ich dachte es geht dir eigentlich nur ums Design? Die DIV Box zum ein/ausblenden. Code: <div id="versteck_mich"></div> Die HTML Links könnten so aussehen, kannst du natürlich auch mit Buttons machen oder sowas. Code: DIV einblenden DIV ausblenden Und das JavaScript sieht dann so aus. Code: function div_show (box_id) { document.getElementById(box_id).style.visibility = 'visible'; } function div_hide (box_id) { document.getElementById(box_id).style.visibility = 'hidden'; } Aber das JavaScript lässt sich auch recht schnell mit google finden

04.06.2008, 10:57
rbs_phoenix Erfahrener Benutzer Registriert seit: 03.11.2004 Beiträge: 289	Jo geht.. Dankeschön!! __________________ Homepage: http://www.rbs-page.de