Frames... Grafiken überlagern sich

**Griever** · 30.12.2004 22:32

Wenn man sich diese Seite (sry, Grafiken sind noch nicht optimiert... naja, um ehrlich zu sein, hab ich keinen besonders guten Jpg-Konvertierer §ka Ja, ich n00b und so -_-) nicht mit einer Auflösung von 1024x768 und im IE oder Mozilla ansieht, gibts Probleme... also wenn das Fenster kleiner wird, überlagern sich die Grafiken...

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
   "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>The Eldar Project</title>
</head>
<frameset rows="120,*" frameborder="0" framespacing="0" border="0">
  <frame src="header.htm" name="Header" noresize scrolling="no" marginheight="0">
  <frameset cols="167,688,167">
  <frame src="menu5.htm" name="Menu" noresize scrolling="no" marginwidth="10">
  <frame src="eintrag5.htm" name="Eintrag" noresize scrolling="no">
  <frame src="seite.htm" name="Rand" noresize scrolling="no" marginwidth="10">
  </frameset>
</frameset>
  <noframes>
  Der Browser kann diese Seite nicht anzeigen.
  </noframes>
</frameset>
</html>

Hab alle mir bekannten Frame-Tutorials abgesucht, aber nichts gefunden. Weiß hier vielleicht jemand was?

**pazzi** · 30.12.2004 23:00

Wenn ich mir das so ansehe hast du die Grafiken so gestalltet, dass sie die 1024 Pixel in der Breite genau ausfüllen, folglich ist es doch vollkommen logisch, dass sie sich überlagern müssen, wenn du das Browser fenster auf >1024 Pixel verkleinerst.
Die einzige gute Möglichkeit, die mir jetzt einfällt, wäre die Seitenränder dezent mir einem schwarzem Strich o.ä. direkt zu teilen, so dass du in der Mitte nur weiß als Hintergrund hast und keinen Farbverlauf. Die Position des Wolfes könnte man dann mit CSS noch so ausrichten, dass er immer zentriert ist.

**el primato** · 30.12.2004 23:05

Ja, das ist ganz normal

Du hast ja für die breite der 3 framespalten pixelwerte angegeben (167, 688, 167). Das ergäbe zusammengezählt in etwa 1024 (bin jetz zu faul zum rechnen

). Wenn man jetzt aber mit einer höheren auflösung alles anguckt, dann passen diese werte ja nicht mehr und der leere platz dazwischen muss ausgefüllt werden. Also wird das hintergrundbild wiederholt. Diese wiederholung kannst du mit CSS sehr einfach verhindern:

Code:

style="background-repeat:no-repeat;"

Habs nicht ausprobiert, aber du musst wahrscheinlich noch die breite für die mittlere spalte wegmachen und ein sternchen * dafür nehmen. Dann sollte es richtig aussehen.

**Griever** · 30.12.2004 23:05

@Avrilan
Was ich nur nich haben wollte, war ja, das die Schrift nur den weißen Hintergrund hat, sondern halt auch ein kleines Stück in die Grafik reingeht, deswegen ist der Teil ja im Bg. Könnte es natürlich nur links machen, aber dann wäre die Grafik rechts kleiner bzw. dünner oder der Text ginge nicht ganz bis nach Rechts rüber. Ich weiß nicht...
Auf jeden Fall erstmal Danke für die Antwort

edit: @Pogo
Sorry, hab falsch formuliert. Geht eher darum, wenn es kleiner wird. Wenn es zu groß wird, darüber hab ich mir bisher noch keine wirklichen Gedanken gemacht, aber wenn ich schon mal bei Größen bin, sollte ich das wohl auch beachten ^^"

***Kermit*** · 30.12.2004 23:07

Du kannst auch dem linken und rechten Frame ne feste Breite geben und in der Mitte dann für die Breite ein * eintragen. Dadurch bleiben die Menüs gleich breit.

**Griever** · 30.12.2004 23:18

Ja, kenne das *, war auch vorher drin, aber dann treten auch Grafikfehler auf, weil der Bg des mittleren Fensters sowohl an die Grafik rechts, als auch die Grafik links anschließt. Beide Grafiken waren ursprünglich so ja 210+745 die je Seite hab ich etwa 40 Pixel abgeschnitten und in den Bg des mittleren Fensters geprackt, damit der Text auf beiden Seiten in die Grafik hineinragt...

**el primato** · 30.12.2004 23:25

Zitat von Erzengel

Sorry, hab falsch formuliert. Geht eher darum, wenn es kleiner wird. Wenn es zu groß wird, darüber hab ich mir bisher noch keine wirklichen Gedanken gemacht, aber wenn ich schon mal bei Größen bin, sollte ich das wohl auch beachten ^^"

Achso

Naja, ich dachte nur, weil ich 1280*1024 benutz und da siehts auch ein wenig komisch aus.

Dann zerteil doch das mittlere hintergundbild, so dass du die seiten einzeln per div und CSS positionieren kannst, wenn du jetzt verstehst was ich mein. Dann bräuchte die mitte keine feste größe.

**Griever** · 30.12.2004 23:31

Nicht so ganz... Also zerteilen hört sich schon mal ganz gut an ^1^ Aber wie bleibt der Text dabei über den verschiedenen Grafiken?

edit: *vorzeitig doppelpost vorbeug* Danke kermit, ich versuchs gerade noch, aber ich kenn mich mit CSS (oder was es ist) nicht so richtig aus... bisher recht erfolglos, ich versuchs morgen... äh später noch mal.

edit2:

Okay, ich geb auf, jemand der das nicht hinbekommt sollte sich überlegen, ob da wirklich das richtige für ihn ist... Trotzdem Danke an kermit!

***Kermit*** · 30.12.2004 23:38

Möglich wäre sowas:

HTML-Code:

<html>
<head>
    <style>
        #links
        {
            position:absolute;
            top:0px;
            left:0px;
            width:120px;
            height:100%;
            z-index:1;
            background-image:url(url/zum/bild);
        }
        #rechts
        {
            position:absolute;
            top:0px;
            left:100%
            left-margin:-120px;
            width:120px;
            height:100%;
            z-index:1;
            background-image:url(url/zum/bild);
        }
        #main
        {
            position:absolute;
            top:0px;
            left:0px;
            width:100%;
            height:100%;
            z-index:2;
        }
    </style>
</head>
<body>
    <div id="links"></div>
    <div id="rechts"></div>
    <div id="main">
        Weiterer Inhalt
    </div>
</body>
</html>

Die Divs für links und rechts musst du dann natürlich noch in der Breite deinem ild anpassen.

Frames... Grafiken überlagern sich

Themen-Optionen

Frames... Grafiken überlagern sich

Berechtigungen