✔ Text lässt sich nicht über Bild schieben

F

Foxgame

Mitglied
Hi

ich versuche schon seit längerem weniger erfolgreich mein Hauptmenü auf der Website auf einem Bild zu plazieren. Aber der Text bleibt immer unterhalb des Bildes. Durch mein Rumprobieren wurde es auch nicht besser.

vll kann mir ja einer von euch sagen was ich da wieder mal falsch gemacht habe.

Hier noch der Code

HTML: 
<html>
<head>
<jdoc:include type="head" />
<meta name="generator" content="">
<title>Reformhaus Buck</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/buck/css/style.css" type="text/css" />
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0" width="181">
  <tr>
    <td rowspan="1" colspan="1"><img height="184" border="0" width="181" src="<?php echo $this->baseurl ?>/templates/buck/images/left_oben.gif" name="Nleftframe_01_01"/></td>
  </tr>
  <tr>
    <td rowspan="1" colspan="1"><img height="118" border="0" width="181" src="<?php echo $this->baseurl ?>/templates/buck/images/left_logo.gif" name="Nleftframe_02_01"/></td>   
  </tr>
  <tr>
    <td rowspan="1" colspan="1"><img height="303" border="0" width="181" src="<?php echo $this->baseurl ?>/templates/buck/images/left_mitte.gif" name="Nleftframe_03_01"/></td>
  </tr>
  <tr>
    <td rowspan="1" colspan="1"><img height="126" border="0" width="181" src="<?php echo $this->baseurl ?>/templates/buck/images/left_unten.gif" name="Nleftframe_04_01"/></td>  
  </tr>
</table> 



<div id="Layer1" style="position:absolute; width:139px; height:138px; z-index:100; left: 24px; top: 17px">
  <MAP NAME="movie"> </MAP> <OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
 codebase="http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0"
 ID=movie WIDTH=120 HEIGHT=120>
 <PARAM NAME=movie VALUE="<?php echo $this->baseurl ?>/templates/buck/swf/movie.swf">
 <PARAM NAME=menu VALUE=false>
 <PARAM NAME=quality VALUE=high>
 <PARAM NAME=bgcolor VALUE=#000000>
 <embed src="<?php echo $this->baseurl ?>/templates/buck/swf/movie.swf" width="120" height="120">

<SCRIPT LANGUAGE="JavaScript" src="check_flash.js"></SCRIPT>

<NOEMBED><img height="120" border="0" width="120" usemap="#movie" src="<?php echo $this->baseurl ?>/templates/buck/swf/movie.jpg" name="movie1"/></NOEMBED>
<NOSCRIPT><img height="120" border="0" width="120" usemap="#movie" src="<?php echo $this->baseurl ?>/templates/buck/swf/movie.jpg" name="movie1"/></NOSCRIPT>
</OBJECT>
</div>
         

<div id="oben">
<img height="80" border="0" width="839" src="<?php echo $this->baseurl ?>/templates/buck/images/topframe.gif" name="top"/>
</div>

<div id="menu">
<jdoc:exists type="modules" condition="top">
<jdoc:include type="modules" name="top" style="xhtml" /></jdoc:exists>
</div>

<div id="text">
<jdoc:include type="component" style="xhtml" />
</div>

<div id="unten">
<img height="61" border="0" width="365" src="<?php echo $this->baseurl ?>/templates/buck/images/bottomframe.jpg" name="bottom"/>
</div>
</body>
</html>
CSS
Code: 
body {
background-color : #fdf6cb;
}

div.c1 {
position : absolute;
width : 139px;
height : 138px;
z-index : 1;
left : 10px;
top : 0;
}

#oben {
top : 8px;
position : absolute;
clip : rect(auto,auto,auto,auto);
right : 5px;
left : 187px;
bottom : 130px;
background-image : url(images/topframe.jpg);
z-index : 1;
visibility:hidden;
}

#menu {
top : 4px;
position : absolute;
clip : rect(auto,auto,auto,auto);
right : 5px;
left : 187px;
bottom : 130px;
color : blue;
z-index : 2;
}

#unten {
background-repeat : no-repeat;
position : absolute;
height : 61px;
width : 665px;
right : 0;
left : 332px;
top : 666px;
bottom : 0;
visibility : visible;
background-image : url(images/bottomframe.jpg);
}

#inhalt {
width : 740px;
height : 638px;
position : absolute;
left : -148px;
top : -690px;
color : #065a9f;
visibility : visible;
}

#text {
position : absolute;
height : 496px;
width : 747px;
left : 208px;
top : 102px;
color : #065a9f;
visibility : visible;
font-size : 2px;
}

.moduletable_menu {
color : blue;
top : -4px;
}

.mainlevel {
color : blue;
top : 4px;
}

img {
border : none;
}

.sichtbar {
z-index : 1;
}

.nowrap {
top : 4px;
color : blue;
}
Frohe Ostern

Foxgame
 

Anhänge

  • menü.jpg
    menü.jpg
    15,1 KB · Aufrufe: 17
Zuletzt bearbeitet:
Hi,

den von dir angehängten Screenshot kann ich mit deinen Quellcode-Angaben bei mir browserübergreifend nicht reproduzieren, sprich: die festgelegten Startpositionen für #Layer1, #oben, #text und #unten werden von allen mir zur Verfügung stehenden Browsern korrekt interpretiert.

Das lässt aus meiner Sicht zunächst mal folgende Vermutungen zu, weshalb bei dir die Regeln vom Browser nicht wie gewünscht interpretiert werden:

  1. Der Pfad zu einer der beiden eingebundenen CSS-Dateien stimmt nicht, oder gar beide.
  2. Durch das Einbinden zweier (gleichnamiger) CSS-Dateien (aus unterschiedlichen Verzeichnissen heraus) werden die Regeln im ersten Stylesheet durch die im zweiten Stylesheet überschrieben.
  3. In einem der beiden Stylesheets ist ein Syntax-Fehler verborgen, der hier nicht veröffentlich wurde.

mfg Maik
 
ich hab jetzt noch mal was ausprobiert und den Code nochmal ein bisschen gesäubert. Wenn ich den Bereich "oben" auf visibility:hidden setze. Wird das Menü auch nicht angezeigt obwohl das eigentlich ein ganz eigenständiger div-container währe. Das Menü sollte in dem grünen Balken stehen.

Ich habe den Code oben nochmal aktualisiert.
 
Zuletzt bearbeitet:
Foxgame hat gesagt.:
ich hab jetzt noch mal was ausprobiert und den Code nochmal ein bisschen gesäubert. Wenn ich den Bereich "oben" auf visibility:hidden setze. Wird das Menü auch nicht angezeigt obwohl das eigentlich ein ganz eigenständiger div-container währe. Das Menü sollte in dem grünen Balken stehen.
Zum Vergrößern anklicken....
Dann hol mal die Lupe raus, um das Menü am Bildschirm zu entziffern:
Code: 
#text {
position : absolute;
height : 496px;
width : 747px;
left : 208px;
top : 102px;
color : #065a9f;
visibility : visible;
font-size : 2px;
}


mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück