Foto vergrössert Tabellenrahmen

Status
Nicht offen für weitere Antworten.

Teilzeitphilosoph

Erfahrenes Mitglied
N´abend.
Ich hab ma ne Frage zu HTML und Tabellen mit Fotos. Ich bastel mir ne Tabelle, die links und rechts vom Bildschirmrand jeweils 100px Abstand halten soll..hat geklappt. Dann wird die Tabelle zu 100% angegeben und in 3 Teile á 10%, 20% und 70% unterteilt...hat auch geklappt.
Nun das Problem: Ich hab in den ersten beiden Tabellen jeweils etwas Text stehen, was die Breite aber nicht beeinflusst. Im letzten Drittel ist ein Bild drin, was allerdings zu groß ist und somit den Rand der Tabelle nach rechts erweitert. Zwar hab ich das Bild mit den Werten Width="50%" und Height="50%" versehen und das Bild ist tatsächlich nur noch halb so groß aber der Rand schießt dennoch nach rechts raus, obwohl das Bild jetzt zu klein dafür ist.
Woran kann das liegen, was hab ich verpasst?

-bedank-
TZP
 
Hi,

ohne Einsicht in den vollständigen Quellcode (HTML + CSS) lässt sich derzeit nicht viel dazu sagen.
 
Darauf hätt ich eigentlich gestern auch noch kommen können. :)
Ich benutz den IE 6.0 auf nem XP-Rechner.

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>

<title> Muh </title>

<style type="text/css">
a:link { text-decoration:none; font-weight:bold; color:#008080; }
a:visited { text-decoration:none; font-weight:bold; color:#6A5ACD; }
a:hover { text-decoration:none; font-weight:bold; background-color:#9ACD32; }
html, body {margin:0; padding:0; width:100%; height:100%; overflow:hidden;}
body {font-family:"Courier New"; color:white;}
#background{position:absolute; z-index:1; width:100%; height:100%;}
#scroller {position:absolute; width:100%; height:100%; top:0; left:0; overflow:auto; z-index:2;}
#content {padding:10px 100px 10px 100px;}
.p1 {font-family:"Courier New"; color:white; font-size:120%;}
</style>
</head>

<body>
<div>
<img id="background" src="picz/hintergrund.jpg" alt="" title="" />
</div>

<div id="scroller">
<div id="content">

<h1>Fotoz</h1>

<table border="1" width="100%">
  <colgroup>
    <col width="20%">
    <col width="80%">
  </colgroup>

  <tr>
    <th><span class="p1">Jump To</span></th>
    <th><span class="p1"><a href="##">#</a>
                         <a href="#A">A</a>
                         <a href="#B">B</a>
                         <a href="#C">C</a>
                         <a href="#D">D</a>
                         <a href="#E">E</a>
                         <a href="#F">F</a>
                         <a href="#G">G</a>
                         <a href="#H">H</a>
                         <a href="#I">I</a>
                         <a href="#J">J</a>
                         <a href="#K">K</a>
                         <a href="#L">L</a>
                         <a href="#M">M</a>
                         <a href="#N">N</a>
                         <a href="#O">O</a>
                         <a href="#P">P</a>
                         <a href="#Q">Q</a>
                         <a href="#R">R</a>
                         <a href="#S">S</a>
                         <a href="#T">T</a>
                         <a href="#U">U</a>
                         <a href="#V">V</a>
                         <a href="#W">W</a>
                         <a href="#X">X</a>
                         <a href="#Y">Y</a>
                         <a href="#Z">Z</a></span></th>
  </tr>
</table>

<table border="1" width="100%">
  <colgroup>
    <col width="10%">
    <col width="20%">
    <col width="70%">
  </colgroup>

  <tr>
    <th><span class="p1">Buchstabe</span></th>
    <th><span class="p1">Nickname-Realname</span></th>
    <th><span class="p1">Foto(s)</span></th>
  </tr>
  <tr>
    <td>#</td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td valign="top"><a name="A">A</td>
    <td valign="top">Adsci - Marcel</td>
    <td><img src="picz/rg/Adsci - Marcel.jpg" alt="" border="3" width="50%" height="50%"></td>
  </tr>
 
Meinst du den hier?

Code:
<td overflow:hidden><img src="picz/rg/Gruppenfoto.jpg" alt="" border="3" width="50%" height="50%"></td>

Hab ich gemacht aber das klappt nich. Dafür klappt es, wenn ich statt der Prozente die wirkliche halbe Pixelanzahl eingebe...aber ich wollte eigentlich nicht jedes Mal erst die Bildattribute rauspopeln und dann halbieren.:)
 
jep wobei das eher so stehen müsste:
Code:
<td overflow="hidden">
falls das geht..oder so:
Code:
<td style="overflow:hidden;">


...ich hatte auch öfters schon probleme mit den prozentualen angaben in tabellen..
 
Status
Nicht offen für weitere Antworten.
Zurück