Text richtig auf Grafik positionieren

S

SimplyFred

Grünschnabel
Hallo,
vielleicht könnte sich jemand mal den folgenden Code anschauen und mir auf die Sprünge helfen, was da falsch ist.
Beim vergrössern/verkleinern des Fensters im Browser
bleibt der Text "Herzlich Willkommen bla bla
bla bla. bla bla:"
einfach an der gleichen Stelle stehen

Die Bilder head/bg/fuss sind immer schön zentriert in der Mitte.

Das hätte ich auch gerne mit dem Text ...

Was bekomme ich das hin Bin am Verzweifeln hier ...

Danke schonmal vorab an die Profis ...

Code: 
<!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=utf-8" /> 
<title>Unbenanntes Dokument</title> 
<style type="text/css"> 
<!-- 
body { 
 background-image: url(images/Back.jpg); 
 position: inherit; 
} 
#box2 { 
 position: absolute; 
 top:249px; 
 left:538px; 
 width:402px; 
 height:127px; 
 z-index:0; 
 font:Arial; 
 font-size:10px; 
} 


--> 
</style></head> 



<body> 
<div id="box2"> 
<div align="left">Herzlich Willkommen bla bla <br /> 
    bla bla. 

      <br /> 
      <br /> 
    bla bla:</div> 
</div> 



<table width="914" border="0" align="center"> 
  <tr> 
    <td width="970" height="602" align="center" valign="middle"><div align="center"><img src="images/Head.jpg" alt="head" width="800" height="110" align="absmiddle" /><br /> 
        <img src="images/bild.jpg" alt="bg" width="800" height="400" align="absmiddle" /><br /> 
    <img src="images/Fuss.jpg" alt="fuss" width="800" height="90" align="absmiddle" /></div></td> 
  </tr> 
</table> 
<br /> 
</body> 
</html>
 
Hallo,
ich bin zwar kein Profi, aber kann es sein, dass es an der position:absolut, die du im CSS für Box2 festgelegt hast liegt.
Dort drin steht exakt die Stelle, an der der Browser dein Bild anzeigen soll in Relation zur Fenstergröße. Wenn deine Angaben nun so gesetzt sind, dass sie außerhalb des Fensters liegen, wenn du es verkleinerst wird es natürlich nicht angezeigt.

Deswegen versuch am besten mal alles mit position:relative festzulegen.

Hoffe ich konnte dir weiterhelfen und dein Problem ist damit gelöst,
Gruß,
Nadine
 
Moin,

wenn du #box2 einen left-Wert von 50% gibst und ein margin-left:-201px; sollte dies den gewünschten Effekt bringen.

Der left-Wert sogt dafür, dass sich der linke Rand von #box2 in der Fenstermitte befindet.

Über das negative margin(Hälfte der Breite von #box2) wird es dann nach Links verschoben, so dass sich die Mitte von #box2 in der Fenstermitte befindet.....und dort auch bleibt, wenn sich die Fenstergrösse ändert.
 
Zuletzt bearbeitet:
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück