nicht angemeldet
HTML-Tabelle scrollable machen
0 0 0 
Gernot Back
HTML-Tabelle scrollable machen
Hi,
ich bin noch ganz unerfahren was das programieren angeht, :). Kann ich denn in einer HTML Tabelle ein einzelnes Feld oder eine extra Tabelle scroll fähig machen, während ein fester Rahmen darum herum stehen bleibt wo er ist?
Gruß Udopea
-
"scrollable" jaja der einfluss der FastFoodnation ist eindeutig spürbar ;)
Schau doch mal nach "overflow" das dürfte dir weiterhelfen.
-
Hi,
Kann ich denn in einer HTML Tabelle ein einzelnes Feld scroll fähig machen, während ein fester Rahmen darum herum stehen bleibt wo er ist?
Ja. Habe zelle_scrollen.htm in meinem Werkzeugkoffer gefunden:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<meta http-equiv="content-language" content="de">
<meta name="date" content="2005-01-09">
<meta http-equiv="expires" content="0"><!-- 0 = von Originaladresse laden --><title>Tabelle</title>
<meta name="author" content="Rudi Remso">
<meta name="robots" content="index, follow">
<meta name="revisit-after" content="5 days"><style type=text/css>
<!--
div.mitte {
position: absolute;
top: 10%;
left: 15%;
height: 85%;
width: 82%;
overflow: auto;
background-color: #ff0;
}
h1 { margin:0; }
p { margin:0 0 0.4em 0; }
table.xx {
height: 100%;
width: 100%;
border-collapse: collapse;
background-color: #08f;
}
table.xx td { border:1px solid #f80; padding:1px; }
table.xx td.td22 {
background-color: #fd0;
overflow: scroll;
vertical-align: top;
}
.gr { font-size:1.2em; }
.kl { font-size:0.8em; }
.sp1 { width:15%; }
.sp2 { width:82%; }
.sp3 { width:03%; }
.zl1 { height:10%; }
.zl2 { height:85%; }
.zl3 { height:05%; }
.c00a { color:#00a; }
.cfff { color:#fff; }
.co { text-align:center; vertical-align:top; }
.bg08f{ background-color:#08f; }
//-->
</style></head>
<body style='margin:0; padding:0; font-family:sans-serif;'>
<table align=center class='xx'>
<tr>
<td class='zl1 sp1'>11</td>
<td class='zl1 sp2'>
<h1 class='gr co cfff'>PC - Einzelunterricht</h1>
<p class='co cfff'>mit Laptop für Privat und Selbständige in Ihren Räumen </p>
</td>
<td class='zl1 sp3'>13</td>
</tr><tr>
<td class='zl2 sp1'>
21<br>
<a href='#top'>Top</a><br>
<a href='#test_1'>Test 1</a><br>
</td>
<td class='zl2 sp2'>
</td>
<td class='zl2 sp3'>23</td>
</tr><tr style='background-color:#08f; height:1em;'>
<td class='zl3 sp1'>31</td>
<td class='zl3 sp2'>32</td>
<td class='zl3 sp3'>33</td>
</tr>
</table><div class='mitte'>
<a name='top'></a>
Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>
<a name='test_1'></a>
<h3>Test 1</h3>
Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>
Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>
Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>Test<br>
</div></body>
</html>-
Hallo Kalle_B,
> div.mitte { > position: absolute; > top: 10%; > left: 15%; > height: 85%; > width: 82%; > overflow: auto; > background-color: #ff0; > }(...)
> </tr> > </table> > > <div class='mitte'> > <a name='top'></a>Damit scrollst du aber nicht den Inhalt einer Tabellenzelle, sondern einen separaten Inhalt, dem du ohne jeden inhaltlichen HTML-Bezug zu den Tabelleninhalten lediglich über CSS eine willkürliche Position gibst.
Gruß Gernot
-
Hallo.
Irgendwie ist das Forum immer noch buggy; die Codeblöcke werden hin und wieder falsch gesetzt. Tidy bestätigt dies:
Zeile 102 Zeichen 80 - Warnung: replacing unexpected code by </code>
Zeile 102 Zeichen 50 - Warnung: missing </code> before </p>Firefox und IE übergehen dies gutmütig, im Opera werden die Formatierungen durcheinander geworfen.
Einen schönen Donnerstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]
-
-
-
Hallo Udopea,
ich bin noch ganz unerfahren was das programieren angeht, :). Kann ich denn in einer HTML Tabelle ein einzelnes Feld oder eine extra Tabelle scroll fähig machen, während ein fester Rahmen darum herum stehen bleibt wo er ist?
Wenn du wirklich tabellarische Daten hast und unbedingt eine Tabelle mit scrollfähigen Bereichen brauchst, kannst du mal hier schauen:
http://forum.de.selfhtml.org/archiv/2005/4/t106696/#m661905
oder auch hier:
http://aktuell.de.selfhtml.org/artikel/javascript/scrolltabelle/
Ansonsten, wenn es dir bei der Tabelle nur ums Layout geht, die einzelnen Zellen inhaltlich also nichts mit ihren Schwestern in den jeweils selben Zeilen und Spalten zu tun haben, lass lieber die Finger vom Tabellenlayout und lass die einzelnen Bereiche lieber gleich mit einem tabellenlosen CSS-Layout über
[link:http://de.selfhtml.org/css/eigenschaften/positionierung.htm#overflow@title=overflow:auto;]scrollen. Das ist dann auch für dich als Anfänger(in) deutlich einfacher und läuft dann auch browserübregreifend viel stabiler.Gruß Gernot
