Änderung der Bannerbreite

pete · Beitrag von **pete** » Mo 9. Mai 2005, 15:54

Hallo zusammen!
Ich habe ein -denke ich- einfaches, aber für mich nicht lösbares Problem. Da ich mit Tabellen sehr auf Kriegsfuß stehe, benötige ich eure Hilfe.

Ich benutze Contenido 4.4.5, und das Layout ist unverändert "Serienmäßig". Jetzt zu dem Problem: Ich möchte den Banner von 400 auf 600 ändern. Habe dies auch schon in der Tabelle von dem Banner versucht, jedoch mit dem Erfolg, das es mir die rechten Container alle wegverschoben hat bis zum Ende des Banners. Dieser sollte aber die Container überspannen. Container 3, also der der rechts neben den Banner steht, wanderte bei mir zu den Containern 8-10 in die Tabelle. Naja, und jetzt stehen Container 3, 8-10 200 Pixel weg von dem "Inhaltsbereich"...
Kann mir von euch einer sagen, wieso und wie ich die rechten Container bzw. deren Tabelle direkt neben den Hauptinhalt bekomme? Danke für eure Hilfe!
Hier mal der Quelltext:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Bierstüberl</title>
<link rel="stylesheet" type="text/css" href="css/format.css">
<script language="JavaScript">
function insert(gif)
{
document.gb.comments.value +=gif;
return;
}
</script>

</head>

<body bgcolor="white" style="margin:0px">
<table width="100%" height="100%" cellspacing="0" cellpadding="0" border="0">
<tr><td height="5"></td></tr>
<tr><td align="center">
<table width="800" border="0" height="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="200" align="center">CMS_CONTAINER[1]</td>
<td align="center" height="80" with="400">
<table width="600" border="0" height="80" cellspacing="0" cellpadding="0" background="images/background.jpg" style="border: 1px;border-color: #F7C473; border-style: dashed; background-color: #FCF2D5">
<tr><td>
<table border="0" cellspacing="0" cellpadding="0" width="600" height="80">
<tr><td> </td></tr><tr><td align="right" valign="bottom">


CMS_CONTAINER[2]


</td></tr>
</table>
</td></tr>
</table>

</td>
</tr>

<tr><td colspan="3" height="5"></td></tr>

<tr>
<td align="right" valign="top">

CMS_CONTAINER[4]


</td>
<td valign="top">

<table width="400" height="50%" border="0" cellspacing="0" cellpadding="0" style="border: 1px;border-color: #F7C473; border-style: dashed; background-color: #FCF2D5">
<tr><td height="20" colspan="2"> </td></tr>
<tr><td rowspan="3" width="25"> </td>
<td valign="top" height="30" class="headline">CMS_CONTAINER[5]</td></tr>
<tr><td valign="top" height="30" class="subheadline">CMS_CONTAINER[6]</td></tr>
<tr><td valign="top" height="100%" class="text">CMS_CONTAINER[7]</td></tr>
</table>

</td>

<td align="center" valign="top">

<table cellspacing="0" cellpadding="0" border="0">

<tr>
<td>CMS_CONTAINER[3]</td>
</tr>

<tr>
<td>CMS_CONTAINER[8]</td>
</tr>

<tr>
<td>CMS_CONTAINER[9]</td>
</tr>

<tr>
<td>CMS_CONTAINER[10]</td>
</tr>

</table>

</td></tr></table>

</td></tr></table>
</body>
</html>

Beleuchtfix · Beitrag von **Beleuchtfix** » Mo 9. Mai 2005, 18:45

Dir ist beim Umkopieren der Container 3 irgendwie nach unten gerutscht!

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Bierst&uuml;berl</title>
<link rel="stylesheet" type="text/css" href="css/format.css">
<script language="JavaScript">
function insert(gif)
{
document.gb.comments.value +=gif;
return;
}
</script>


</head>

<body bgcolor="white" style="margin:0px">
<table width="100%" height="100%" cellspacing="0" cellpadding="0" border="1" bordercolor="#00ff00">
<tr><td height="5"></td></tr>
<tr><td align="center">
<table width="800" border="1" height="100%" cellspacing="0" cellpadding="0" bordercolor="#0000ff">
<tr>
<td width="200" align="center">CMS_CONTAINER[1]</td>
<td align="center" height="80" with="400" colspan="2" bordercolor="#ff0000">
<table width="600" border="1" height="80" cellspacing="0" cellpadding="0" background="images/background.jpg" style="border: 1px;border-color: #F7C473; border-style: dashed; background-color: #FCF2D5">
<tr><td>
<table border="0" cellspacing="0" cellpadding="0" width="600" height="80">
<tr><td> </td></tr><tr><td align="right" valign="bottom" >

<!--hilfsnavi-->
CMS_CONTAINER[2]
<!--hilfsnavi ende-->

</td></tr>
</table>
</td></tr>
</table>

</td>
</tr>

<tr><td colspan="3" height="5"></td></tr>


<tr>
<td align="right" valign="top">
<!--navi-->
CMS_CONTAINER[4]
<!--navi ende-->

</td>
<td valign="top">
<!--inhalt-->
<table width="400" height="50%" border="1" cellspacing="0" cellpadding="0" style="border: 1px;border-color: #F7C473; border-style: dashed; background-color: #FCF2D5">
<tr><td height="20" colspan="2"> </td></tr>
<tr><td rowspan="3" width="25"> </td>
<td valign="top" height="30" class="headline">CMS_CONTAINER[5]</td></tr>
<tr><td valign="top" height="30" class="subheadline">CMS_CONTAINER[6]</td></tr>
<tr><td valign="top" height="100%" class="text">CMS_CONTAINER[7]</td></tr>
</table>
<!--inhalt ende-->
</td>

<td align="center" valign="top">

<table cellspacing="0" cellpadding="0" border="0">

<tr>
<td>CMS_CONTAINER[3]</td>
</tr>

<tr>
<td>CMS_CONTAINER[8]</td>
</tr>

<tr>
<td>CMS_CONTAINER[9]</td>
</tr>

<tr>
<td>CMS_CONTAINER[10]</td>
</tr>

</table>

</td></tr></table>

</td></tr></table>
</body>
</html>

Wenn man sehen möchte, wie die Tabellen verschachtelt sind, dann einfach Border=1 setzen und eventuell bei den einzelnen tabellen die Farbe noch unterschiedlich machen. Das hilft meistens weiter.

Viel Erfolg
Florian

pete · Beitrag von **pete** » Mo 9. Mai 2005, 19:45

Erst mal vielen Dank!
Leider nicht ganz das Richtige.
Den Container 3 hab ich mit Absicht runter, er sollte, wie die anderen Container (8-10) vom "Banner" überspannt werden. Wahrscheinlich hab ich mich da unglücklich ausgedrückt.
Neuer Versuch:
Der "Inhaltsbereich" sollte die Breite von 400 px behalten, die Container rechts davon (3,8-10) sollten zu ihm nach links rüberwandern.
Was ich nicht verstehe, warum nach der Inhaltstabelle (Container 5-7) nach dem </td> so ein großer Freiraum entsteht...

Beitrag von **Halchteranerin** » Mo 9. Mai 2005, 20:05

meinst du so etwas?

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Bierst&uuml;berl</title>
<link rel="stylesheet" type="text/css" href="css/format.css">
<script language="JavaScript">
function insert(gif)
{
document.gb.comments.value +=gif;
return;
}
</script>


</head>

<body bgcolor="white" style="margin:0px">
<table width="100%" height="100%" cellspacing="0" cellpadding="0" border="1">
<tr><td height="5"></td></tr>
<tr><td align="center">
<table width="800" border="1" height="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="200" align="center">CMS_CONTAINER[1]</td>
<td height="80" colspan="2" align="center" with="400">
<table width="600" border="1" height="80" cellspacing="0" cellpadding="0" background="images/background.jpg" style="border: 1px;border-color: #F7C473; border-style: dashed; background-color: #FCF2D5">
<tr><td>
<table border="1" cellspacing="0" cellpadding="0" width="600" height="80">
<tr><td> </td></tr><tr><td align="right" valign="bottom">

<!--hilfsnavi-->
CMS_CONTAINER[2]
<!--hilfsnavi ende-->

</td></tr>
</table>
</td></tr>
</table>

</td>
</tr>

<tr><td colspan="4" height="5"></td></tr>


<tr>
<td align="right" valign="top">
<!--navi-->
CMS_CONTAINER[4]
<!--navi ende-->

</td>
<td valign="top" width="400">
<!--inhalt-->
<table width="400" height="50%" border="1" cellspacing="0" cellpadding="0" style="border: 1px;border-color: #F7C473; border-style: dashed; background-color: #FCF2D5">
<tr><td height="20" colspan="2"> </td></tr>
<tr><td rowspan="3" width="25"> </td>
<td valign="top" height="30" class="headline">CMS_CONTAINER[5]</td></tr>
<tr><td valign="top" height="30" class="subheadline">CMS_CONTAINER[6]</td></tr>
<tr><td valign="top" height="100%" class="text">CMS_CONTAINER[7]</td></tr>
</table>
<!--inhalt ende-->
</td>

<td valign="top" width="200"><table cellspacing="0" cellpadding="0" border="1">
  <tr>
    <td>CMS_CONTAINER[3]</td>
  </tr>
  <tr>
    <td>CMS_CONTAINER[8]</td>
  </tr>
  <tr>
    <td>CMS_CONTAINER[9]</td>
  </tr>
  <tr>
    <td>CMS_CONTAINER[10]</td>
  </tr>
</table></td>
</tr></table>

</td></tr></table>
</body>
</html>

Beitrag von **Halchteranerin** » Mo 9. Mai 2005, 20:05

aehm, die border="1" muesstest du wieder auf border="0" zurueckstellen ...

Beleuchtfix · Beitrag von **Beleuchtfix** » Mo 9. Mai 2005, 20:07

pete hat geschrieben:Wahrscheinlich hab ich mich da unglücklich ausgedrückt.

Stimmt

Damit wir nicht nur Mengen an unerwünschten Tabellen hier veröffentlichenhabe ich die Tabelle in obigen Beitrag geändert.
Vielleicht passs es jetzt???

Die Border=1 musst du, wenn es stimmt wieder zurücksetzen

pete hat geschrieben: Neuer Versuch:
Der "Inhaltsbereich" sollte die Breite von 400 px behalten, die Container rechts davon (3,8-10) sollten zu ihm nach links rüberwandern.

Schau mal nach dem colspan="2"

Was ich nicht verstehe, warum nach der Inhaltstabelle (Container 5-7) nach dem </td> so ein großer Freiraum entsteht...

In der Tabellendefinition steht height="50%". Wenn du das entfernst, ist die Tabelle genau so groß, wie sie sein muss.

pete · Beitrag von **pete** » Mo 9. Mai 2005, 20:41

Vielen Dank!
Passt, hab bloß noch align= in "left" geändert, weil die oberen Zeilen sonst leicht versetzt zu den unteren war.
Aber ansonsten Perfekt!

Also vielen Dank noch mal für die kompetente Hilfe an alle!