Grafik wiederhohlt sich nicht

MoRuK_68 · 12. Mai 2008

Hallo, ich habe nach einem tutorial eine webseite erstellt. Das Problem ist das natürlich nicht alles funktioniert obwohl ich genau die schritte befolgt habe.

Das Problem ist folgendes:
Wenn ich was eintippe soll sich die Webseite automatisch nach unten verlängern. Die Webseite wird vom Hintergrund links und rechts durch eine grafik abgegrenzt, die sich nach unten immer wiederhohlen soll.
Es soll sich aber nur der unterste Teil der "abgrenzung" wiederhohlen da im oberen ein verlauf und scanlines drinnen sind die dann ausfaden und zu einer farbe werden. Deswegen hab ich die Grafik geteilt und für das untere Stück den folgenden Code benutzt:
<td rowspan="4" td background="Bilder/index_13.gif"></td>

Der Code des oberen Teilstücks lautet:
<td rowspan="4">
<img src="Bilder/index_02.gif" width="25" height="742" alt=""></td>

In Dreamweaver sieht auch alles gut aus aber wenn ich es mit dem Browser öffne verschiebt sich
1. das obere Teilstück nach unten und
2. Wird das untere Teilstück nicht wiederhohlt sondern nur 1 mal angezeigt

Hier noch 2 Bilder:

Die Seite habe ich im Photoshop erstellt/ gesliced und dann mit Dreamweaver geöffnet.

Hoffe ihr könnt mir helfen!
Danke für die Antworten

Anzeige

GaYlORd · 12. Mai 2008

AW: Grafik wiederhohlt sich nicht

vergiss tabellen.
layoute mit css

und da gibts den schönen befehl "background-repeat" bei dem man das perfekt einstellen kann

einfach mal googlen bzw. selfhtml durchstöbern

MoRuK_68 · 12. Mai 2008

AW: Grafik wiederhohlt sich nicht

Und wenn ichs jetzt aber doch mit tabellen machen will?
weiß jemand was da der fehler seien könnte?

t-low · 12. Mai 2008

AW: Grafik wiederhohlt sich nicht

das einzige, was mir auffält ist, dass du im ersten tag 2 mal td geschrieben hast...

sonst bitte ganzen code posten

GaYlORd · 12. Mai 2008

AW: Grafik wiederhohlt sich nicht

du gibst der spalte zeile oder was auch immer eine class-wert.

also: <td class="bla"></td>

und in css sagst du:
.bla{ background-repeat:repeat-x; }
oder statt x y.
oder einfach googlen!

MoRuK_68 · 13. Mai 2008

AW: Grafik wiederhohlt sich nicht

Kann man mit dreamweaver überhaupt layouts ohne tabellen erstellen?

Hier der gesammte Code:

<html>
<head>
<title>xxx</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">

body {
background-image: url(Bilder/Hintergrund.jpg);
background-repeat: repeat-x;
background-color: #3C2C53;
}
</style></head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<center><table id="Tabelle_01" width="1025" height="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="110" height="800" rowspan="5"></td>
<td rowspan="4">
<img src="Bilder/index_02.gif" width="25" height="742" alt=""></td>
<td>
<a href="index.html"><img src="Bilder/index_03.gif" alt="" width="147" height="41" border="0"></a></td>
<td>
<a href="videos.html"><img src="Bilder/index_04.gif" alt="" width="151" height="41" border="0"></a></td>
<td>
<a href="forum.html"><img src="Bilder/index_05.gif" alt="" width="158" height="41" border="0"></a></td>
<td>
<a href="extras.html"><img src="Bilder/index_06.gif" alt="" width="151" height="41" border="0"></a></td>
<td>
<a href="shop.html"><img src="Bilder/index_07.gif" alt="" width="147" height="41" border="0"></a></td>
<td rowspan="3">
<img src="Bilder/index_08.gif" width="26" height="737" alt=""></td>
<td width="109" height="800" rowspan="5"> </td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="41" alt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="Bilder/index_10.gif" width="754" height="215" alt=""></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="215" alt=""></td>
</tr>
<tr>
<td colspan="5" rowspan="3"><table id="Tabelle_01" width="754" height="544" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="10" height="10"><img src="Bilder/index_11_01.gif" width="10" height="10" alt=""></td>
<td width="734" background="Bilder/content-2_02.gif"></td>
<td width="10" height="10"><img src="Bilder/index_11_01.gif" width="10" height="10" alt=""></td>
</tr>
<tr>

<td background="Bilder/content-2_04.gif"></td>

<td bgcolor="#EBEBEB"><p>fas</p>
<p>fs</p>
<p>ad</p>
<p>sdaf</p>
<p>s</p>
<p>df</p>
<p>asdf</p>
<p>sa</p>
<p>f</p>
<p>saf</p>
<p>as</p>
<p>fa</p>
<p>sf</p>
<p>asf</p>
<p>asf</p>
<p>as</p>
<p>fa</p>
<p>sf</p>
<p>asf</p>
<p>as</p>
<p>fa</p>
<p>sasf</p>
<p> </p>
<p> </p>
<p> </p></td>
<td background="Bilder/content-2_04.gif"></td>
</tr>
<tr>
<td width="10" height="10"><img src="Bilder/index_11_01.gif" width="10" height="10" alt=""></td>
<td background="Bilder/content-2_08.gif"></td>
<td width="10" height="10"><img src="Bilder/index_11_01.gif" width="10" height="10" alt=""></td>
</tr>
</table></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="481" alt=""></td>
</tr>
<tr>

<td rowspan="2" td background="Bilder/index_12.gif"></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="5" alt=""></td>
</tr>
<tr>
<td rowspan="4" background="Bilder/index_13.gif"></td>
<td>
<img src="Bilder/Abstandhalter.gif" width="1" height="58" alt=""></td>
</tr>
</table></center>

</body>
</html>

GaYlORd · 13. Mai 2008

AW: Grafik wiederhohlt sich nicht

der post über deinem von mir beinhaltet die lösung für dein problem!

Cooler quellcode...
ja, kann man, solange man nur die quellcode ansicht hernimmt!

StrikeFreedom · 13. Mai 2008

AW: Grafik wiederhohlt sich nicht

mir wird schlecht...

Aber ja es geht, wie mit jedem anderem Editor, Stichpunkt CSS: Layout ohne Tabellen

MoRuK_68 · 13. Mai 2008

AW: Grafik wiederhohlt sich nicht

Da ich jetzt überall gelesen habe das tabellen nicht für designs taugen hab ich mich jetz entschieden das ganze mal ohne zu probieren wie mr. nicht heterolord es mir schon gesagt hat. Aber die probleme gehn gleich los. Kennt jemand einen link wo steht wie ich grafiken mit css positioniere?

Z.b. die navigationsleiste soll ganz oben mittig angezeigt werden aber ohne zwischenräume zwischen den einzelnen grafiken.

Bei mir sind zwischenräume zwischen den grafiken und zwischen der oberen kante und den grafiken, hier der quellcode:

<style type="text/css">

body {background-image:url(grafiken/Hintergrund.jpg);
background-repeat:repeat-x;
background-color:#3C2C53;}

img {border:none}

</style>
</head>

<body style="margin:0px; padding:0px;">
<p>
<a href="home.html"> <img src="grafiken/home.gif" width="147" height="41" alt="Home" /> </a>
<a href="videos.html"> <img src="grafiken/videos.gif" width="151" height="41" alt="Videos" /> </a>
<a href="forum.html"> <img src="grafiken/forum.gif" width="158" height="41" alt="Forum" /> </a>
<a href="extras.html"> <img src="grafiken/extras.gif" width="151" height="41" alt="Extras" /> </a>
<a href="shop.html"> <img src="grafiken/shop.gif" width="147" height="41" alt="Shop" /> </a>
</p>

</body>
</html>

GaYlORd · 14. Mai 2008

AW: Grafik wiederhohlt sich nicht

sehr löblich, dass du es jetzt so versuchst!!

Musst dich aber durch tuts ackern. (aber nach spätestens 24h, sollte das meiste geläufig sein, weils echt logisch ist!)

Ein CSS-Layout erstellen (Webdesign) | andreas-kalt.de

CSS Tutorial - Inhaltsverzeichnis - HTML.net

CSS 4 You - The Finest in Stylesheets

Bei <body> brauchst du margin und padding nicht!!
du positionierst alles mittels <div class="bild1"><a href="bild1.jpg"><img src=..... /></a></div>

und class=bild1 hat in der css die gewünschten werte.
z.b.:
.bild1{

height: 5px;
width: 10px;

}
o.ä.

gruß
gl

MoRuK_68 · 14. Mai 2008

AW: Grafik wiederhohlt sich nicht

Hab mich jetzt den ganzen gestrigen Tag durchgeackert und das design fertiggestellt.
In Firefox sieht es genau so aus wie ich es wollte und das layout passt sich auch der seitenlänge an.

Doch dann der große schock: Ich öffne das ganze im Internet Explorer und steh wieder ganz am Anfang. Das Design wird dort total falsch angezeigt. Header viel zu weit unten und über den Rand hinaus. Navigationsleiste auf einmal 2 zeilig und wieder mit abständen zwischen den bilder.

Wie kann das sein und was kann ich tun?
Bin grad total frustriert von dem ganzen SCH***
Kann mir jemand helfen? Vllt über icq?
Wäre sehr dankbar!

Hier is mal der Quellcode und ein bild des designs (firefox und ie) vllt sticht euch ja irgent ein fehler ins auge:

Internet Explorer:

{bild-down: http://img.7pics.info/ie_9a3_thumb.png}

Firefox:

{bild-down: http://img.7pics.info/firefox_6a8_thumb.png}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="author" content="philipp l.">
<meta name="description" content="Dies ist die offizielle Homepage von Y_TITTY">
<meta name="copyright" content="philipp l.">
<meta name="keywords" content="y-*****, y_titty, y *****, kurzfilme, philipp, tizi, high school musical verarsche, freund oder nicht freund, stift in der nase,">
<title>Y_TITTY</title>
<style type="text/css">

body
{
background-image:url(grafiken/hintergrund.jpg);
background-repeat:repeat-x;
background-color:#3C2C53;
margin:0px; padding:0px;
}

img
{
border:none;
}

#container
{
margin: auto;
width: 807px;
text-align: left;
background-image:url(grafiken/containerhintergrund.gif);
background-repeat:repeat-y

}

#borderleft
{
float:left;
width:26px;
}

#mainnav
{
margin: auto;
height: 41px;
}

#header
{
margin: auto;
height: 215px;
}

#borderright
{
float:right;
width:27px
}

#contents
{
margin-right: 47px;
margin-left: 46px;
background-color: #EBEBEB;
}

</style>
</head>

<body>
<div id="container">
<div id="borderleft">
<img src="grafiken/linkerrand.gif" width="26" height="799" alt="" />
</div>
<div id="borderright">
<img src="grafiken/rechterrand.gif" width="27" height="799" alt="" />
</div>
<div id="mainnav">
<a href="home.html"> <img src="grafiken/home.gif" width="147" height="41" alt="Home" /></a><a href="videos.html"><img src="grafiken/videos.gif" width="151" height="41" alt="Videos" /></a><a href="forum.html"><img src="grafiken/forum.gif" width="158" height="41" alt="Forum" /></a><a href="extras.html"><img src="grafiken/extras.gif" width="151" height="41" alt="Extras" /></a><a href="shop.html"><img src="grafiken/shop.gif" width="147" height="41" alt="Shop" /></a> </div>
<div id="header">
<img src="grafiken/header.gif" width="754" height="215" alt="Y_TITTY Header" />
</div>
<div id="contents">
<p>Lately I've observed didactic comments in other forums that say margins and paddings should be given with em instead of px. It seems counterintuitive to me and if someone has an explanation I'd like to hear it.
Let's assume that you have a page designed using paragaph font size set to 1 em. Both margin and padding use em.
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<p>laber</p>

</div>
</div>
</body>
</html>

Nützliche Suchen

Grafik wiederhohlt sich nicht

Videos zum Themenbereich