mutzel6: re2: Firefox - Tabelle breiter als <tbody>

Beitrag lesen

SELF-Forum

re2: Firefox - Tabelle breiter als <tbody>

mutzel6
– Informationen zu den Bewertungsregeln

@@mutzel6:

Ich habe mir das im DOM Inspector angeschaut.

Ich würde mir das auch gern anschauen, nur wie?

Live long and prosper,
Gunnar

kuckst Du hier:
http://de.selfhtml.org/html/tabellen/anzeige/table_tr_th_td.htm

... ist einfach eine beliebige Tabelle. Wenn man im DOM Inspector-Baum das <table>-Element anklickt, wird ein Bereich vom linken Rand der Tabelle bis zum rechten Fensterrand umrahmt. Das <tbody>-Element ist nur so groß wie es sich gehört.

Ich hänge mal den Quelltext für eben diese Seite an + mein JavaScript + die Ergänzung in <table>. Der Effekt ist genau wie bei mir: es erscheint sofort ein Scrollbalken, auch wenn rechts noch jede Menge Platz ist.

Ich kann hier keinen Link zu meiner Seite anbringen, da die Seite auf einem firmeninternen Server liegt und der Quelltext ist über 1000 Zeilen lang ... aber das Prinzip bzw. das Problem ist das gleiche.

----------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Aufbau einer Tabelle - table, tr, th, td, border</title>
<script type="text/javascript">
//Tabellen bewegen
 drag = 'inaktiv';
 aktivX = 0; aktivY = 0; aktivTab = null; aktivZindex = 1000;
 function init() {
  tabellen = document.getElementsByName('result');
  for (i=0; i<tabellen.length; i++) { tabellen[i].onmousedown = mdown; }
  if (document.captureEvents) document.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
  document.onmouseup = mup;
  document.onmousemove = mmove;
 }
 window.onload = init;
 function mdown(e){
  aktivTab = this;
  aktivTab.style.zIndex = aktivZindex++;
  drag = 'aktiv';
  aktivX = (e)?e.pageX:event.clientX + document.body.scrollLeft;
  aktivY = (e)?e.pageY :event.clientY + document.body.scrollTop;
  return false;
 }
 function mmove(e){
  if (drag == "inaktiv") return;
  var neuX = (e) ? e.pageX:event.clientX + document.body.scrollLeft;
  var neuY = (e) ? e.pageY:event.clientY + document.body.scrollTop;
  var distX = (neuX-aktivX);
  var distY = (neuY-aktivY);
  aktivX = neuX;
  aktivY = neuY;
  aktivTab.style.left = parseInt(aktivTab.style.left) + distX + 'px';
  aktivTab.style.top  = parseInt(aktivTab.style.top) + distY + 'px';
 }
 function mup(e){
  drag = "inaktiv";
 }
</script>
</head>
<body>

<h1>Tabelle mit Gitternetzlinien</h1>

<table border="1" name="result" style="position:relative;left:0px;top:0px">
  <tr style="cursor:pointer">
    <th>Berlin</th>
    <th>Hamburg</th>
  <th>M&uuml;nchen</th>
  </tr>
  <tr>
    <td>Milj&ouml;h</td>
    <td>Kiez</td>
  <td>Bierdampf</td>
  </tr>
  <tr>
    <td>Buletten</td>
    <td>Frikadellen</td>
    <td>Fleischpflanzerl</td>
  </tr>
</table>

<h1>Tabelle ohne Gitternetzlinien (blinde Tabelle)</h1>

<table border="0">
  <tr>
    <td><h2>ARQ</h2></td>
    <td><p>Automatic Repeat Request. Eine allgemeine Bezeichnung f&uuml;r Fehlerprotokolle, die
    &Uuml;bertragungsfehler erkennt und defekte Bl&ouml;cke selbst&auml;ndig wiederholt</p></td>
  </tr>
  <tr>
    <td><h2>HDLC</h2></td>
    <td><p>High Level Data Link Control. Ein Standard-Protokoll, das von der Kommission f&uuml;r
    internationale Standards f&uuml;r Softwareanwendungen in synchronen Anlagen verwendet wird.</p></td>
  </tr>
</table>

<p><a href="../aufbau.htm#definieren">zur&uuml;ck</a></p>
</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln