HTML tabellen...sind mist .-nun CSS neue Frage!

God

Donnerstag, 9. März 2006, 15:03

1

www.allyaneed.de/hp/fm/index.htm

simple htm seite - blos tabellen und so -schaut mal bitte in den quelltext - wieso macht der die menu spalte nicht 20pixel breit?

M.-Sys: Gigabyte GA-FX-58-extreme / 920@4Ghz / 6gig Corsair / r9 290 all AC

Wäre es nicht adäquat, den Usus heterogener Termini zu minimieren?
(Sollte man nicht weniger Fremdworte verwenden?)

Religionskriege sind Konflikte zwischen erwachsenen Menschen, bei denen es darum geht, wer den cooleren, imaginaeren Freund hat

biddschedabber

Senior Member

Beiträge: 1 425

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 15:36

2

Quellcode

<table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
  <tr>
    <td>²</td>
    <td width="960">

    
    <table border="0" cellpadding="0" cellspacing="0" width="960" height="100%">
  <tr>
    <td colspan="2" width="960" height="170" bgcolor="#E4D6BA">
    <img border="0" src="head.jpg" width="100%" height="170"></td>
  </tr>
  <tr>
    <td width="20" bgcolor="#E4D6BA">Menu</td>
    <td bgcolor="#E4D6BA">Inhalt</td>

  </tr>
  <tr>
    <td colspan="2" width="100%" height="170" background="footer.jpg" bgcolor="#E4D6BA"></td>
  </tr>
      </table>

      </td>
    <td>²</td>
  </tr>

</table>

Da schüttelt's mich.... wieso sind da zwei table-tags drinne? :-X

Papa_Schlumpf

God

Beiträge: 4 999

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 15:40

3

weil ichn noob bin *g*

Quellcode

<html>

<head>
<meta http-equiv="Content-Language" content="de">

</head>

<body bgcolor="#000000">

<center>
<table border="0" cellpadding="0" cellspacing="0" width="960" height="100%">
  <tr>
    <td colspan="2" width="100%" height="170" background="head.jpg" bgcolor="#E4D6BA"></td>
  </tr>
  <tr>
    <td width="20" bgcolor="#E4D6BA">Menu</td>
    <td bgcolor="#E4D6BA">Inhalt</td>
  </tr>
  <tr>
    <td colspan="2" width="100%" height="170" background="footer.jpg" bgcolor="#E4D6BA"></td>
  </tr>
</table>
</center>

</body>

</html>

so besser? aber immer noch das gleiche prob

M.-Sys: Gigabyte GA-FX-58-extreme / 920@4Ghz / 6gig Corsair / r9 290 all AC

Wäre es nicht adäquat, den Usus heterogener Termini zu minimieren?
(Sollte man nicht weniger Fremdworte verwenden?)

Religionskriege sind Konflikte zwischen erwachsenen Menschen, bei denen es darum geht, wer den cooleren, imaginaeren Freund hat

DerDaniel

God

Beiträge: 3 501

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 15:48

4

vergiss die tabellen!
DIVs heißt das lösungswort... css ist wirklich nicht schwer zu erlernen...

· http://www.css4you.de/
· http://de.selfhtml.org/css/
· http://www.css-technik.de/
· http://css.fractatulum.net/
· http://www.drweb.de/csstechnik/index.shtml
· http://de.wikipedia.org/wiki/Cascading_Style_Sheets

biddschedabber

Senior Member

Beiträge: 1 425

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 15:50

5

Dein Problem wird was damit zu tun haben:

Zitat

Verwenden Sie Pixelangaben und Prozentangaben immer so, dass keine Konflikte entstehen. Im obigen Beispiel werden etwa alle Breiten prozentual bestimmt, und nur die Höhe wird mit Pixeln festgelegt. So kann der Browser im Beispiel für die gesamte Tabelle eine Breite von 60% Prozent zum Elternelement ermitteln und für die erste Spalte wiederum 50% davon. Die Angabe von 100 Pixeln Zeilenhöhe kommt damit nicht in Konflikt.

Quelle: http://de.selfhtml.org/html/tabellen/ges…#breiten_hoehen

Du machst nur Prozent oder gar keine Angabe... das mag der Browser wohl nicht so.

Papa_Schlumpf

God

Beiträge: 4 999

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 16:01

6

Quellcode

<html>

<head>
<meta http-equiv="Content-Language" content="de">

</head>

<body bgcolor="#000000">

<center>
<table border="0" cellpadding="0" cellspacing="0" width="960" height="100%">
  <tr>
    <td colspan="2" width="960" height="170" background="head.jpg" bgcolor="#E4D6BA"></td>
  </tr>
  <tr>
    <td width="100" bgcolor="#0000FF">Menu</td>
    <td width="860" bgcolor="#FF0000">Inhalt</td>
  </tr>
  <tr>
    <td colspan="2" width="960" height="170" background="footer.jpg" bgcolor="#E4D6BA"></td>
  </tr>
</table>
</center>

</body>

</html>

schau nochmal der link oben habs neu hochgeladen und geaendert - jetzt hab ich alles fix angeben ausser ein paar höherangaben und der machts trotzdem falsch - das menu sind niemals 100px (hab 100 gemacht damit mans besser sieht)

M.-Sys: Gigabyte GA-FX-58-extreme / 920@4Ghz / 6gig Corsair / r9 290 all AC

Wäre es nicht adäquat, den Usus heterogener Termini zu minimieren?
(Sollte man nicht weniger Fremdworte verwenden?)

Religionskriege sind Konflikte zwischen erwachsenen Menschen, bei denen es darum geht, wer den cooleren, imaginaeren Freund hat

Papa_Schlumpf

God

Beiträge: 4 999

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 16:03

7

wasn besser tabellen - frames - div ? so wegen crossbrowser kompatibel und so ?

M.-Sys: Gigabyte GA-FX-58-extreme / 920@4Ghz / 6gig Corsair / r9 290 all AC

Wäre es nicht adäquat, den Usus heterogener Termini zu minimieren?
(Sollte man nicht weniger Fremdworte verwenden?)

Religionskriege sind Konflikte zwischen erwachsenen Menschen, bei denen es darum geht, wer den cooleren, imaginaeren Freund hat

biddschedabber

Senior Member

Beiträge: 1 425

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 16:14

8

Streich Tabellen aus Deinem (HTML) Wortschatz.

Y0Gi

God

Beiträge: 12 708

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 16:22

9

Heutzutage löst man sowas mit CSS anstelle der vormals verwendeten "blinden" Tabellen. Der Grund ist, dass CSS für die Darstellung gedacht ist, (X)HTML aber nicht - sondern für die Semantik. Das Layout gehört nicht zu den tabellarischen Daten, also ist eine Tabelle auch die falsche Herangehensweise - vormals gab es allerdings keine Alternative.

Noch ein Link: http://glish.com/css/ (s. Kasten rechts oben, "2 Columns" dürfte für dich interessant sein)

This is my sick nature. – NorthCon // LANresort Bispingen // BYCEPS (LAN party software platform) // OrgaTalk (LAN party orga board)

Papa_Schlumpf

God

Beiträge: 4 999

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 17:48

10

so nun das ganze in css... this is what i learned so far

Quellcode

<HTML>
<HEAD>

<TITLE>...</TITLE>

<META http-equiv=Content-Type content="text/html; charset=windows-1252">

<STYLE type=text/css>@import url( all.css );
BODY {
      TEXT-ALIGN: center
}
#frame {
      PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN-LEFT: auto; WIDTH: 960px; MARGIN-RIGHT: auto; PADDING-TOP: 0px; TEXT-ALIGN: left
}
#contentmenu {
      PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #ffffff; FLOAT: left; PADDING-BOTTOM: 0px; WIDTH: 100px; PADDING-TOP: 0px
}
#contentpage {
      PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #cccccc; FLOAT: left; PADDING-BOTTOM: 0px; WIDTH: 860px; PADDING-TOP: 0px
}
#contenthead {
      BACKGROUND: #E4D6BA; HEIGHT: 170px;
}
#contentfoot {
      BACKGROUND: #E4D6BA; HEIGHT: 170px;
}
</STYLE>

</HEAD>
<BODY>

<DIV id=frame>
<DIV style="background-image:url('head.jpg'); margin:0px; padding:0px" id=contenthead>Head</DIV>
<DIV id=contentmenu>Menu</DIV>
<DIV id=contentpage>Page</DIV>
<DIV style="background-image:url('footer.jpg'); margin:0px; padding:0px" id=contentfoot>Foot</DIV>

<BR clear=all>
<!-- without this little <br /> NS6 and IE5PC do not stretch the frame div down to encopass the content DIVs -->
</DIV>
<BR style="CLEAR: both">

</BODY>
</HTML>

funktioniert sogar einigermassen :
http://www.allyaneed.de/hp/fm/index.htm

nun noch ein zwei fragen..:
-is der quallcode so vertretbar? also crossbrowser und so? grav. Fehler?
-wie bekomm ich nun "menu" und "Page" so hin das sie sich automatisch vergroessern?

M.-Sys: Gigabyte GA-FX-58-extreme / 920@4Ghz / 6gig Corsair / r9 290 all AC

Wäre es nicht adäquat, den Usus heterogener Termini zu minimieren?
(Sollte man nicht weniger Fremdworte verwenden?)

Religionskriege sind Konflikte zwischen erwachsenen Menschen, bei denen es darum geht, wer den cooleren, imaginaeren Freund hat

Y0Gi

God

Beiträge: 12 708

Re: HTML tabellen... ich checks grad nicht

Donnerstag, 9. März 2006, 18:07

11

Zitat von »Papa_Schlumpf«

-is der quallcode so vertretbar? also crossbrowser und so? grav. Fehler?

Nein. Namen von XHTML-Tags und deren Attributen werden klein (lowercase) geschrieben. Selbiges gilt auch für die CSS-Attribute und die Tagnamen, auf die sie angewendet werden. Weiterhin haben HTML-Attribute in Anführungszeichen zu stehen (in deinem Fall z.B. bei id="123").

Zudem fehlt dir als allererstes die DOCTYPE-Definition (siehe http://de.selfhtml.org/html/allgemein/gr…m#dokumenttyp).

Weiterhin solltest du jegliche CSS-Definitionen in eine externe Datei auslagern - und zwar nicht über import(), sondern über ein entsprechendes <link>-Element im <head>-Bereich; siehe http://de.selfhtml.org/css/formate/einbinden.htm#separat

Dann solltest du sinnigerweise noch den Zeichensatz im Kopf von 'windows-1252' auf 'iso-8859-1' ändern. Dann brauchst du weiterhin im übrigen deutsche Sonderzeichen wie Umlaute oder ß nicht mehr durch ü und Konsorten maskieren (was viele unverständlicherweise trotzdem tun).

This is my sick nature. – NorthCon // LANresort Bispingen // BYCEPS (LAN party software platform) // OrgaTalk (LAN party orga board)

Papa_Schlumpf

God

Beiträge: 4 999

Re: HTML tabellen...sind mist .-nun CSS neue Frage

Donnerstag, 9. März 2006, 18:11

12

ok guck ich sofort nach aber was ist mit der dynamischen höhe?

Quellcode

<html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">

<head>

<title>...</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">@import url( all.css );
body {
      text-align: center
}
#frame {
      padding-right: 0px; padding-left: 0px; padding-bottom: 0px; margin-left: auto; width: 960px; margin-right: auto; padding-top: 0px; text-align: left
}
#contentmenu {
      padding-right: 0px; padding-left: 0px; background: #ffffff; float: left; padding-bottom: 0px; width: 100px; padding-top: 0px
}
#contentpage {
      padding-right: 0px; padding-left: 0px; background: #cccccc; float: left; padding-bottom: 0px; width: 860px; padding-top: 0px
}
#contenthead {
      background: #e4d6ba url('head.jpg'); height: 170px;
}
#contentfoot {
      background: #e4d6ba url('footer.jpg'); height: 170px;
}
</style>

</head>
<body>

<div id="frame">
<div id="contenthead"></div>
<div id="contentmenu">Menu</div>
<div id="contentpage">Page</div>
<div id="contentfoot"></div>

<br clear="all">
<!-- without this little <br /> NS6 and IE5PC do not stretch the frame div down to encopass the content divs -->
</div>
<br style="CLEAR: both">

</body>
</html>

so richtig ?klein und gross? auslagern tu ich wenn ich alles soweit zusammen hab.

M.-Sys: Gigabyte GA-FX-58-extreme / 920@4Ghz / 6gig Corsair / r9 290 all AC

Wäre es nicht adäquat, den Usus heterogener Termini zu minimieren?
(Sollte man nicht weniger Fremdworte verwenden?)

Religionskriege sind Konflikte zwischen erwachsenen Menschen, bei denen es darum geht, wer den cooleren, imaginaeren Freund hat