taotao,
Zitat von sejuma
Manchmal ist es nützlich, wenn man eine Nacht drüber schläft.
so ging es mir auch; und hier , wie ich glaube eine flexible Lösung (getestet im IE7;IE6;IE5.5;FF und Opera)
<!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>Tabelle ohne Rahmen</title>
<link href="tabelle.css" type="text/css" rel="stylesheet"media="all" />
<style type="text/css">
<!--
#rahmen {position:relative; padding:10px; width:800px; background-color:#666666;}
#zeile1 {background-color: #808000;width:400px; margin-bottom:10px;}
#zeile2 {background-color: #808000;width:400px;margin-bottom:10px;}
#bild {position:absolute;bottom:10px;right:10px;width:370px;background-color:#FF0033;}
#zeile3 {background-color: #808000;width:400px;}
-->
</style>
</head>
<body>
<div id="rahmen">
<div id="zeile1">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, ......</div>
<div id="zeile2">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, ......</div>
<div id="zeile3">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, ......</div>
<div id="bild">[img]#[/img][img]#[/img]</div>
</div>
</body>
</html>
Alles anzeigen
Das besondere: eine absolute Positionierung in einem Container der relativ positioniert wurde. Zwecks Code-Einsparung geht es auch ohne dem Bild-Container (er würde nur der evtl. weiteren Gestaltung dienen) auf diese Art:
.
Oder wenn es unbedingt eine Tabelle sein muss:
<!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>Tabelle ohne Rahmen</title>
<link href="tabelle.css" type="text/css" rel="stylesheet"media="all" />
<style type="text/css">
<!--
#rahmen {position:relative;padding:10px;width:800px;background-color:#666666;}
#bild {position:absolute;bottom:10px;right:10px;width:370px;background-color:#FF0033;}
-->
</style>
</head>
<body>
<div id="rahmen">
<table width="400" border="1">
<tr>
<td>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, ...... </td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, ...... </td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, ...... </td>
</tr>
</table>
<div id="bild">[img]#[/img][img]#[/img]</div>
</div>
</body>
</html>
Alles anzeigen