mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 27.04.2024 00:20 Benutzername: Passwort: Auto-Login

Thema: Tabellegröße an Div anpassen vom 16.05.2006

Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Tabellegröße an Div anpassen
Autor Nachricht
sachsflo
Threadersteller

Dabei seit: 16.05.2006
Ort: München
Alter: -
Geschlecht: Männlich
Verfasst Di 16.05.2006 14:44
Titel

Tabellegröße an Div anpassen

Antworten mit Zitat Zum Seitenanfang

Hallo zusammen.

Ich stehe vor folgendem Problem:
Ich habe ein Tabellengestütztes Layout (das später als Template für Typo3 dienen soll).
Hinter dem Inhaltsbereich soll ein Hintergrundbild (in diesem Fall ein Fußballfeld) liegen, dessen Größe sich abhängig vom Inhalt der Zelle anpasst. Für den Anfang wäre ich mit einer Variante mit skalieren des Bild auf 100% Höhe schon zufrieden (allerdings soll hier eine Mindestgröße von den Grundausmassen der Grafik erhalten bleiben, sprich das ganze soll sich nur bei Inhaltsüberlauf vergrößern, nicht aber verkleinern, wenn weniger Inhalt drin ist).
Lieber wäre mir allerdings eine Lösung, bei der nicht die Hintergrundgrafik vollständig skaliert wird, sondern die die freien Bereiche (im Beispiel die Bereiche zwischen Strafraum und Mittelkreis).

Bei meinen bisherigen Versuchen, das ganze zu realisieren, indem ich sowohl die Grafik als auch den Inhalt mit DIV-Elementen in die Tabelle einzufügen, steht der Text entweder unter der Grafik (und erweitert die Zellenhöhe entsprechend) oder überlagert zwar das Bild, läuft aber nach Ende der Grafik aus der Tabelle heraus.

Das ganze könnt Ihr euch unter kinderwelt.cafe-netzwerk.de anschauen.

Ich füge unten mal den Code der Seite ein.

Bin für jeden Tip dankbar.

Florian

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
   background-color: #0A50A1;
}
-->
</style></head>

<body>
<table width="760" height="838" border="0" align="center">
  <tr bgcolor="#000000">
    <td height="80" colspan="3">&nbsp;</td>
  </tr>
  <tr>
    <td width="130" bgcolor="#FF0000">&nbsp;</td>
    <td width="486" height="752" valign="top" bgcolor="#31A028">
<div style="position:static; z-index: 1;">  <img src="Fußballfeld-schwarz.jpg" height="100%"/> </div>
<div style="position:absolute; top:114px; left:296px; width: 454px; color: #FFFFFF; z-index: 5;" id="Inhalt">
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>anieaasdfdasfasdfasdfasdfasdfasdfasdffa</p>
  <p>asdkfjasdkfjasdkjfkasdjfklsdjaklfjasdklfjklasdjfklasdjfkas&ouml;fksdaj&ouml;fkasdjfk</p>
  <p>&nbsp;</p>
</div>
   </div></td>
    <td width="130" bgcolor="#FFFF00">&nbsp;</td>
  </tr>
</table>
</body>
</html>
  View user's profile Private Nachricht senden
Ähnliche Themen URL anpassen?
Div an Inhalt anpassen
PDF-Seitengröße anpassen ...
Farben anpassen?
Fotos anpassen
CMS anpassen aufwendig ?
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.