Background Problem

kalfany · 8. August 2005

Hallo,
schaut euch mal folgendes Layout an:
http://www.webmix-fun.com/designs_webmix/design_tosend/index.html

Das klappt an den Seiten mit dem Background optimal, er wird per repeat-x; immer angehängt. Den Background findet ihr hier:
http://www.webmix-fun.com/designs_webmix/design_tosend/bilder/images_r1_c5.jpg

So , wenn nun aber der Inhalt in der Mitte größer wird, sieht der Background an den Seiten so aus:
http://www.webmix-fun.com/designs_webmix/design_tosend/index_lang.html

Er soll aber auch so schön andocken, wie bei der index.html.

Ich habe schon einiges mit background-position und so probiert, aber klappt nicht wirklich.
Mit einer Tabelle um das Design nochmal rum, habe ich auch schon probiert:
http://www.webmix-fun.com/designs_webmix/design_tosend/index_lang2.html

Aber irgendwie wird der Background da nur gespiegelt.

Code von der index.html:

HTML:

<!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">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
<table width="968" border="0" cellpadding="0" cellspacing="0">
  <!--Tabelle-->
  <tr>
    <td height="266" colspan="3" valign="top"><table width="100%" border="0" cellpadding="0" cellspacing="0">

      <!--Tabelle_Header-->
      <tr>
        <td width="331" height="266" valign="top"><img src="bilder/images_r1_c1.jpg" border="0" alt=""></td>
        <td width="637" valign="top"><img src="bilder/images_r1_c2.jpg" border="0" alt=""></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td width="331" height="439" valign="top" style="background-image: url(bilder/images_r7_c1.jpg);"><table width="100%" border="0" cellpadding="0" cellspacing="0">

      <!--Tabelle_Links_Oben-->
      <tr>
        <td height="37" colspan="2" valign="top"><img src="bilder/images_r2_c1.jpg" border="0" alt=""></td>
      </tr>
      <tr>
        <td width="164" height="312" valign="top" style="background-image: url(bilder/images_r4_c1.jpg);"><table width="100%" border="0" cellpadding="0" cellspacing="0">
          <!--Tabelle_Links_Oben-->
          <tr>
            <td width="164" height="312" valign="top" style="background-image: url(bilder/images_r3_c1.jpg);background-repeat:no-repeat;"><!--leer--></td>

          </tr>
        </table></td>
        <td width="167" valign="top" style="background-image: url(bilder/images_r4_c2.jpg);"><table width="100%" border="0" cellpadding="0" cellspacing="0">
          <!--Tabelle_Links_Menu-->
          <tr>
            <td width="167" height="312" valign="top" style="background-image: url(bilder/images_r3_c2.jpg);" class="schrift_links">
<a href="index.html">HOME</a><br>
<br>
NEWS<br><br>

AKTUELLER ANLASS<br><br>
AGENDA<br><br>
GALERIE<br><br>
FORUM<br><br>
APPLIKATIONEN<br><br>
VORSTAND<br><br>
LINKS<br><br>
PHILOSOPHIE<br><br>
CONTACT</td>

          </tr>
        </table></td>
      </tr>
      <tr>
        <td height="23" colspan="2" valign="top"><img src="bilder/images_r5_c1.jpg" border="0" alt=""></td>
        </tr>
    </table></td>
    <td width="519" valign="top" style="background-color: #FFFFFF;"><table width="100%" border="0" cellpadding="0" cellspacing="0">
      <!--Tabelle_Mitte-->

      <tr>
        <td width="519" height="439" valign="top" class="schrift_mitte">Hier kommt der Inhalt rein + <a class="mitte" href="index.html">Linktext</a> </td>
      </tr>
    </table></td>
    <td width="118" valign="top" style="background-image: url(bilder/images_r7_c4.jpg);"><table width="100%" border="0" cellpadding="0" cellspacing="0">
      <!--Tabelle_Rechts_Oben-->
      <tr>

        <td width="118" height="442" valign="top"><img src="bilder/images_r2_c4.jpg" border="0" alt=""></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td height="55" colspan="3" valign="top"><img src="bilder/images_r9_c1.jpg" border="0" alt=""></td>
  </tr>
</table>
</body>
</html>

Code von der style.css:

Code:

/* CSS Document */
BODY {
	FONT-SIZE: 10px; COLOR: #000000; font-family: Arial, Verdana, Helvetica, sans-serif;
	background-image: url(bilder/images_r1_c5.jpg);
    background-repeat:repeat-x;
    background-color: #000000;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
}
A:link {
	COLOR: #FFFFFF; TEXT-DECORATION: none
}
A:visited {
	COLOR: #FFFFFF; TEXT-DECORATION: none
}
A:hover {
	COLOR: #FFFFFF; TEXT-DECORATION: none
}
A.mitte:link {
	COLOR: #616161; TEXT-DECORATION: none
}
A.mitte:visited {
	COLOR: #616161; TEXT-DECORATION: none
}
A.mitte:hover {
	COLOR: #616161; TEXT-DECORATION: none
}
.schrift_links {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
color: #FFFFFF;
font-weight: bold;
padding-left: 5px;
}
.schrift_mitte {
color: #616161;
}

Ich hoffe ihr könnt mir helfen, danke.

Suche

Background Problem

kalfany

Cadet 1st Year

Ähnliche Themen