HTML text rutscht beim minimieren in meine Bilder

Unregistriert

Ich würde mich sehr über eure hilfe freuen mir ist das problem erst gerade aufgefallen und ich muss meine präsentation am freitag halten:(
<html>
<head>
<title>Kreaturen System</title>
<link rel="stylesheet" type="text/css" href="./styles/design2.css">

</head>

<div class="banner">
<a> <image src="./bilder/banner.jpg" /> </a>
</div>

<div class="animation">
<a href="#"> <image src="./bilder/animation.gif" /></a>
</div>

<div class="animationzwei">
<a href="#"> <image src="./bilder/animation.gif" /></a>
</div>

<div class="navi">

<p style="color:#ff0000"> <a href="index.html"> <image src="./buttons/button1up.png" /></a><a href="home.html"><image src="./buttons/button7up.png" /></a><a href="pvp.html"> <image src="./buttons/button2up.png" /></a><a href="finanz.html"> <image src="./buttons/button4up.png" /></a> <a href="fan.html"> <image src="./buttons/button5up.png" /></a><a href="imp.html"> <image src="./buttons/button6up.png" /></a></p>
</div>

<div class="linkesbild2">
<a> <image src="./bilder/kainen.jpg" /> </a>

</div>

<div class="text">
<font size="5" color="#FF0000" face="Curlz MT">
<p>Einteilung Basis-Einzigartig.</p>
<p>Magie Kreaturen und Kampfkreaturen.</p>
<p>Durch töten von Monstern bekommt man leere Karten.</p>
<p>Wahrscheinlichkeit sie zu fangen liegt bei</p>
<p>Basis Kreaturen: 90%</p>
<p>Gewöhnliche Kreaturen: 45%</p>
</p>Ungewöhnliche Kreaturen: 15%</p>
</p>Seltene Kreaturen: 5%</p>
</p>Sehr seltene Kreaturen 2.5% und Einzigartige Kreaturen 1%</p>

</font>

</div>

</body>

css:
body{
background-image:url(../bilder/text.jpg);
background-color:black;
background-position:100px 0%;
background-repeat:no-repeat;
}

.banner{
position:absolute;
left:50%;
right:50%;
margin-left:-450px;
}

.animation{
top:150px;
position:absolute;
left:50%;
margin-left:-550px;

}
.animationzwei{
top:150px;
position:absolute;
right:50%;
margin-right:-550px;

}
.animationzwei a image{
border: 0px;
}
.animation a image{
border: 0px;
}
.navi a:link img, a:visited img{
border: 3px solid blue;
}
.navi a:hover img, a:active img{
border: 3px solid red;
}
.text{
position:absolute;
top:350px;
right:50%;
left:50%;
width:600px;

}
.text2{
position:absolute;
top:500px;
right:50%;
left:50%;
width:550px;

}
.textimp{
top:250px;
position:absolute;
left:50%;
right:50%;

}
.anschrieb{
position:absolute;
top:350px;
left:10%;

}
.linkesbild{
position:absolute;
top:300px;
left:10%;
}
.linkesbild2{
position:absolute;
top:350px;
left:2%;
}

.videoslinks{
position:absolute;
top:350px;

}
.itemshop{
position:absolute;
top:350px;
}

.navi{
top:180px;
position:absolute;
height:50px;
background:blue;
left:50%;
right:50%;
margin-left:-450px;
width:900px;
}

ist nur bei der seite wo das problem auftritt bei den anderen habe ich es notdürftig gelöst^^:D

Grevas

Kannst du auch sagen um was für ein Problem es sich handelt? Und in welchen Browser dieser auftritt?

Ich sehe nur, dass die Bilder nicht geladen werden können - logischer weise. Wenn du es auf einen Server hochladen könntest, würde es uns die Aufgabe um einiges erleichtern.

Unregistriert

Mein problem ist ich habe Links ein bild und rechts ein text , im vollbildmodus schaut alles super aus jedoch sobalt ich die seite minimiere rutscht der text in die bilder und der text fängt mitten im linken bild an welches eigendlich nur als optik dienen sollte. ich hoffe das hat dir mein problem näher gebracht :).
Vielen dank für die schnelle antwort

Grevas

Naja. Ich weiß jetzt worum es geht, ohne die Bilder kann ich es aber nicht nachvollziehen, sry. Lade es bitte irgendwo hoch.

Wenn du es nicht hochladen kannst, musst du mir leider ein Gerüst ohne Bilder bauen - dafür aber mit Containern die den gleichen Platz beanspruchen.

//Btw: 1k Posts, yay ?

//Edith: Ok, ich habe mir die Struktur etwas angeschaut und glaube wenigstens zu wissen was dein Problem ist. Ich würde eine Vollständige Version bevorzugen, da es dann genauer wird, aber ich schau's mir trotzdem schon mal an.

//Edith-2: Pöh. Ich weiß gar nicht wo ich anfangen soll.
Deine Seite hat keine Breite, da es sich um eine Präsentation handelt ist die Lage schon etwas problematisch. Bei einem Beamer würde ich mich nicht auf eine Auflösung über 640x480 verlassen, wenn es kein Uralt Ding ist hat es vielleicht 1280x1024.

Also. Ich brauche wirklich:
- eine Version inklusive Bilder
- die Ausgangssituation (auf welchen Browser wird es laufen bzw. wird es ein aktuellen Browser geben? Auflösung (die Schrift ist mit 24px ok)?

Unregistriert

Bild der Homepage im vollbildmodus:
http://imageshack.us/photo/my-images/585/voher.jpg/
Bild der homepage sobalt man sie minimiert
http://imageshack.us/photo/my-images/607/fnnn.jpg/

ich hoffe das ist gut genug das du verstehst was ich meine

Grevas

So viel konnte ich mir schon zusammenreimen aus deiner Beschreibung & den Style-Definitionen.

Die Frage ist, was du nun erwartest? Soll der Text jetzt umbrechen (sprich, unter das Bild kommen) oder sollen einfach horizontale-Scrollbalken (früher) reinkommen? Laut deinem Code passiert ja genau das, was ich auf den Screens seh
Aufjedenfall musst du die Präsentantionsumgebung kennen (Browser (muss nicht, wäre aber sicherheitshalber nicht verkehrt) und eben die Auflösung). Bei einer 640px breite sieht das ganze dann bestimmt nicht mehr lustig aus.

//P.S. ich bleibe dabei und bitte um eine Lauffähige Version, ich rate hier, wie erwähnt.

//PP.S. anhand der Screenshots, sehe ich, dass es nicht alles sein kann. Du hast eine Schriftart die nicht zu einer normalen Windows Umgebung gehört. Wenn du es auf einem anderen Rechner anschaust, wird es anders aussehen. Nagut, im Code steht's auch - aber die Anbindung in der Seite fehlt und da spielt auch das Betriebssystem eine Rolle.

Unregistriert

Da ich sie nicht hochladen will da uhrheberechtliche blabla sachen drinnsind und so habe ich dir mal meine homepage lokale daten alle in ein rar file gepackt und hochgeladen hier ist der download link vielen dank für die mühe.

http://www.share-online.biz/dl/AK0JSL6M1D2

Unregistriert

Ich werde morgen nachmittag/abend wieder vorbeischaun da ich morgen sehr früh raus muss und deshalb jetzt schlafen gehe , ich hoffe du/ihr könnt mir noch helfen meine homepage so umzupolen das sie genau so aussieht jedoch beim minimieren nicht so crapy wird ;).
Vielen dank auf jeden fall nochmal

Unregistriert

Broweser ist Internetexploter oder FireFox am besten^^
Hab erst vor 5 Tagen mit HTML angefangen und noch nicht viel zeit damit verbracht deswegen bin ich wohl noch ein "noob"

Grevas

Multiposts sind (glaube ich) nicht erwünscht, benutze lieber die Edit Funktion des Forums.

Viel wichtiger aber, weswegen ich sofort antworte: dieser Upload ist ne sauerei, ich soll ein Download abwarten um dir zu helfen? Das Forum hat eine Anlage-Funktion - benutze die lieber... Ich hab's trotzdem mal geladen.

//Edith: ./bilder/kainen.jpg fehlt. Genau die Grafik um die es geht

//Edith_2: weil weitere Infos fehlen, hab ich's so gemacht wie ich's für richtig halte.

HTML

<html>
    <head>
    <title>Kreaturen System</title>
    <link rel="stylesheet" type="text/css" href="./styles/design2.css">


    </head>
       <div class="banner">
       <a> <image src="./bilder/banner.jpg" /> </a>
       </div>

       <div class="animation">
        <a href="#"> <image src="./bilder/animation.gif" /></a>
       </div>

        <div class="animationzwei">
        <a href="#"> <image src="./bilder/animation.gif" /></a>
       </div>

      <div class="navi">

        <p style="color:#ff0000"> <a href="index.html"> <image src="./buttons/button1up.png" /></a><a href="home.html"><image src="./buttons/button7up.png" /></a><a href="pvp.html"> <image src="./buttons/button2up.png" /></a><a href="finanz.html"> <image src="./buttons/button4up.png" /></a> <a href="fan.html"> <image src="./buttons/button5up.png" /></a><a href="imp.html"> <image src="./buttons/button6up.png" /></a></p>
        </div>    


      <div class="kreaturen">
        <div class="img">
          <a> <image src="./bilder/kainen.jpg" /> </a>
        </div>
        <div class="description">
          <font size="5" color="#FF0000" face="Curlz MT">
            <p>Einteilung Basis-Einzigartig.</p>
            <p>Magie Kreaturen und Kampfkreaturen.</p>
            <p>Durch töten von Monstern bekommt man leere Karten.</p>
            <p>Wahrscheinlichkeit sie zu fangen liegt bei</p>
            <p>Basis Kreaturen: 90%</p>
            <p>Gewöhnliche Kreaturen: 45%</p>
            <p>Ungewöhnliche Kreaturen: 15%</p>
            <p>Seltene Kreaturen: 5%</p>
            <p>Sehr seltene Kreaturen 2.5% und Einzigartige Kreaturen 1%</p>
            <p>In dem folgenden Video wird ein bändigungs versuch einer Einzigartigen Kreatur gezeigt</p>
            <object style="height: 390px; width: 640px"><param name="movie" value="http://www.youtube.com/v/M7pb4I4TwLs?version=3&feature=player_detailpage"><param name="allowFullScreen" value="true"><param name="allowScriptAccess" value="always"><embed src="http://www.youtube.com/v/M7pb4I4TwLs?version=3&feature=player_detailpage" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="640" height="360"></object>
          </font>
        </div>

      </div>
      <style type="text/css">
        .kreaturen {
          margin: auto;
          padding-top: 250px;
          width: 900px;
        }
        .kreaturen .img {
          float: left;
          height: 250px;
          width: 350px;
          background: #ccc;
          float: left;
        }
        .kreaturen .description {
          width: 500px;
          float: right;
        }
      </style>
</body>
</html>

Alles anzeigen

Unregistriert

Vielen dank du hast mir sehr geholfen am liebsten würde ich ein danke knopf erfinden und ihn vergewaltigen
habe dank dir auch html etwas verstanden ich werde diese methode auf alle meine seiten anwenden.

Tags