nicht angemeldet
Buttons- und Div-Problem
Für ein Schulprojekt hab ich eine Website über mich selbst zu erstellen. Dabei fallen mir 2 große Probleme an.
Zur Struktur:
Seite besteht aus einem Container. In diesem Container finden sich 2 weitere Divs. 1 für das Menü und 1 für den Content. Im Contentbereich befindet sich noch ein Iframe.
Problem 1: Beim Div fürs Menü sind Buttons drin. Die Buttons haben die gleiche Höhe wie der Menücontainer. Im IE wirds ganz normal angezeigt. Im FF werden die Buttons nach unten geschoben, so dass sie ca. mit der Hälfte im Container und mit der Hälfte herausen sind. Somit muss ich den Container um den Teil, den sie herausschaun höher machen.
Problem 2: Die Buttons verlinken den Iframe. Jedoch bekomm ich es nicht hin, dass der Iframe mit target=framename wieder richtig dargestellt werden, sondern der Frame öffnet sich als ganze Seite.
MfG
-
bischen code wär nett...
-
bischen code wär nett...
OK, hier ist der HTML und der CSS-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=iso-8859-1" />
<title>Prof. Alex's Eventshooters-Ersatz</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head><body onload="MM_preloadImages('buttons/start-blau.gif','buttons/ich-blau.gif','buttons/freunde-blau.gif','buttons/links-blau.gif','buttons/impressum-blau.gif','buttons/pictures-blau.gif')">
<div id="container"><div id="menu">
<blockquote>
<p><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Start','','buttons/start-blau.gif',1)"></a><a href="ich.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('ProfAlex','','buttons/ich-blau.gif',1)"></a><a href="ich.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage(' Alex','','buttons/impressum-blau.gif',1)"></a><a href="ich.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Ich','','buttons/ich-blau.gif',1)"></a><a href="freunde.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Freunde','','buttons/freunde-blau.gif',1)"></a><a href="friends.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Friends','','buttons/freunde-blau.gif',1)"></a><a href="pictures.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Pictures','','buttons/pictures-blau.gif',0)"></a><a href="links.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Links','','buttons/links-blau.gif',1)"></a><a href="impressum.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Impressum','','buttons/impressum-blau.gif',1)"></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Start','','buttons/start-blau.gif',1)"><img src="buttons/start-weiss.gif" alt="Start" name="Start" width="117" height="30" border="0" id="Start" /></a><a href="ich.html" onmouseover="MM_swapImage('Ich','','buttons/ich-blau.gif',1)" onmouseout="MM_swapImgRestore()"><img src="buttons/ich-weiss.gif" alt="Ich" name="Ich" width="117" height="30" border="0" id="Ich" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Freunde','','buttons/freunde-blau.gif',1)"><img src="buttons/freunde-weiss.gif" alt="Freunde" name="Freunde" width="117" height="30" border="0" id="Freunde" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Pictures','','buttons/pictures-blau.gif',1)"><img src="buttons/pictures-weiss.gif" alt="Pictures" name="Pictures" width="117" height="30" border="0" id="Pictures" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Links','','buttons/links-blau.gif',1)"><img src="buttons/links-weiss.gif" alt="Links" name="Links" width="117" height="30" border="0" id="Links" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Impressum','','buttons/impressum-blau.gif',1)"><img src="buttons/impressum-weiss.gif" alt="Impressum" name="Impressum" width="117" height="30" border="0" id="Impressum" /></a></p>
</blockquote>
</div><div id="content"><iframe src="start.html" border="0" name="iframe" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" height="350" scrolling="auto" width="700"></iframe></td>
</div>
</div>
</body>
</html>/* Tags */
body {
background-color: #4485f1;
div-align: center;
}.Stil1 {font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: normal;
color: #FFFFFF;}.Stil2 {
color: #FFFFFF;
font-size: 26px;
font-weight: bold;
}.Stil3 {
color: #FFFFFF;
font-size: 12px;
font-weight: bold;
}a:link {
color: #000000;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #000000;
}
a:hover {
text-decoration: underline;
color: #000000;
}
a:active {
text-decoration: none;
color: #000000;
}/* id's */
#container {
position: absolute;
top: 50%;
left: 50%;
width: 1000px;
height: 600px;
margin-top: -300px;
margin-left: -500px;
background-color: #4485f1;
background-image: url(img/background.jpg);
border: 0;
vertical-align: center;
padding: 0;
z-index: 20;
}#menu{
position: absolute;
width: 800px;
height: 30px;
margin-top: 100px;
margin-left: 100px;
border: 0;
background-color: #FFFFFF;
text-align: center;
z-index: 25;
}#content{
position: absolute;
width: 700px;
height: 350px;
margin-top: 150px;
margin-left: 150px;
border: 0;
background-color: #4485f1;
overflow: scroll;
overflow-x: hidden;
overflow-y: hidden;
z-index: 30;
}-
hi,
OK, hier ist der HTML und der CSS-Code:
Könntest du sowas nächstes mal bitte auf's wesentliche kürzen?
Es ist weder erforderlich, uns alle Buttons zu zeigen, noch uns mit der MacroMedia-Codescheisse zu erschlagen.
<div id="menu">
<blockquote>
<p><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Start','','buttons/start-blau.gif',1)"></a><a href="ich.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('ProfAlex','','buttons/ich-blau.gif',1)"></a>Wieso zum Geier setzt du denn das Menü in Blockquote?
Wen bitte "zitierst" du denn mit einem Menü?
Hochgradiger Unfug, bitte unbedingt entfernen.Und wo bitte ist jetzt in diesem ganzen Käse die Stelle, wo du den Iframe als Linkziel angegeben haben willst?
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Jo, sry, wenn ich da den ganzen Code reingetan hab, war grad leicht im Stress, da hab ich nicht nachgedacht.
Zum Blockquote: Ist einfach vom Dreamweaver eingefügt worden (ist leider mit den Buttons vorgegeben, dass wir es so machen müssen).
<ahref="...html", soll den Link angeben und da Iframe befindet sich hier:
<div id="content"><iframe src="start.html" border="0" name="iframe" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" height="350" scrolling="auto" width="700"></iframe></td>
</div>-
ich hatte jetzt keine lust den ganzen müll auseinander zu nehmen, aber was sicher ist das in deinem link das traget attribut fehlt.
--> http://de.selfhtml.org/html/verweise/definieren.htm#zielfenster
wieso hier irgendwas überlappt das nicht überlappen sollte ist in diesem css ziemlich schwer zu sagen, da grosse unordnung.
-
Ähm ja, das mit dem Target ist mir klar, genau das war ja das Problem, das es nicht funktioniert.
MfG
-
hi,
Ähm ja, das mit dem Target ist mir klar, genau das war ja das Problem, das es nicht funktioniert.
Wie soll es denn bitte funktionieren, wenn du gar kein Target angibst?
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
-
-
-
Zum Blockquote: Ist einfach vom Dreamweaver eingefügt worden (ist leider mit den Buttons vorgegeben, dass wir es so machen müssen).
Hallo,
darf ich Dich mal fragen, ist es eine weiterführende Schule die Du besuchst?
Arbeitet Ihr da öfters mit dem Dreamweaver?
Gruß, noch ein Ich
-
-
-
Hi!
<div id="content"><iframe src="start.html" border="0" name="iframe" marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="0" height="350" scrolling="auto" width="700"></iframe></td>
Was hat denn das
</td>da verloren?mfG
--
ie:} fl:{ br:> va:) ls:< fo:( rl:? n4:# ss:| de: js:| ch:? sh:( mo:? zu:)]
"And all those exclamation marks, you notice? Five? A sure sign of someone who wears his underpants on his head."
(Terry Pratchett)
-
-
-
Seite besteht aus einem Container. In diesem Container finden sich 2 weitere Divs. 1 für das Menü und 1 für den Content. Im Contentbereich befindet sich noch ein Iframe.
Warum hast du noch ein Iframe im Contentbereich?
Problem 1: Beim Div fürs Menü sind Buttons drin. Die Buttons haben die gleiche Höhe wie der Menücontainer. Im IE wirds ganz normal angezeigt. Im FF werden die Buttons nach unten geschoben, so dass sie ca. mit der Hälfte im Container und mit der Hälfte herausen sind. Somit muss ich den Container um den Teil, den sie herausschaun höher machen.
Sehr merkwürdig, dass der IE was richtig macht, was der FF falsch macht. Kannst Du mal bitte prüfen ob Du den DOCTYPE als allererstes setzt? Vor dem DOCTYPE darf nichts stehen, da sonst alle Browser, besonders aber der IE, einige Probleme haben. Ich vermute der Kompatibilitätsmodus von IE ist angesprungen und dass Du auf IE entwickelt hast, dann die Pixelangaben auf das alte Boxmodell angewandt hast und dass Dir deshalb der Firefox jetzt alles falsch darstellt. Wäre für mich eine logische Erklärung.
Problem 2: Die Buttons verlinken den Iframe. Jedoch bekomm ich es nicht hin, dass der Iframe mit target=framename wieder richtig dargestellt werden, sondern der Frame öffnet sich als ganze Seite.
Das machst du am besten im head!
<head>
<base target="iframename" />
</head><body>
...
<iframe name="iframename" ...>
...
</iframe>
...
</body>Hoffe Dir helfen die Angaben, meld Dich nochmal.
Schöne Grüße,
bechte
-
Zum Iframe: Den setz ich ganz einfach nur rein, damit der Inhalt leichter zu Verwalten geht.
Doctyp steht ganz normal an 1. Stelle, daran kanns also nicht liegen. Und zur Entwicklung: Hab eigentlich die ganze Zeit auf FF entwickelt, also dies schließ ich aus.
Beim Iframe weiß komm ich jetz nicht so ganz mit wie das funktionieren soll, da ich 6 Rollover-Buttons hab, die zu 6 verschiedenen Frames verlinken sollen.
MfG
-