2 Navigationsleisten. Eine links, andere rechts am Rand
marcham
- css
Hallo zusammen!
Bin gerade dabei meine erste HP zu erstellen und komme an einem Punkt nicht weiter.
Ich habe links eine Navigationsleiste und möchte nun eine weitere am rechten Rand anlegen. Irgendwie bekomme ich es nicht hin das sie rechts anliegt. Die Leiste/Tabelle hängt sich immer ans untere Ende der Seite dran.
Es wäre super wenn ihr euch das ganze mal anseht und mir vielleicht helfen könnt.
Hier der Link: http://werner.derheuerclan.de
Und hier der 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>der HEUER clan - WERNER</title>
<style type="text/css">
<!--
body {
background-image: url(../Hintergrundbild/Hintergrund.jpg);
background-color: #000;
}
-->
</style>
<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_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_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
if (event == "init" && args.length > 2) {
if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
nbArr[nbArr.length] = img;
for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = args[i+1];
nbArr[nbArr.length] = img;
} }
} else if (event == "over") {
document.MM_nbOver = nbArr = new Array();
for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
nbArr[nbArr.length] = img;
}
} else if (event == "out" ) {
for (i=0; i < document.MM_nbOver.length; i++) {
img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
} else if (event == "down") {
nbArr = document[grpName];
if (nbArr)
for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
document[grpName] = nbArr = new Array();
for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
nbArr[nbArr.length] = img;
} }
}
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_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/100px/ButtonHome100Ro.png','../Buttons/100px/ButtonCharRo100.png','../Buttons/100px/ButtonMarcRo100.png','../Buttons/100px/ButtonMarcoRo100.png','../Buttons/100px/ButtonMatsRo100.png','../Buttons/100px/ButtonMiriRo100.png','../Buttons/120px/ButtonWernerRo120.png','../Buttons/100px/ButtonYannickRo100.png','../Buttons/100px/Fussball100.png','Buttons/100px/ButtonAmsterdamRo100.png','Buttons/100px/ButtonUSA100Ro.png')">
<div align="center"> <a href="../Index.html"><img src="../Titel/Titel.jpg" width="800" height="150" border="0" /></a>
</div>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td><a href="http://www.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Home','../Buttons/100px/ButtonHome100Ro.png',1)" onmouseover="MM_nbGroup('over','Home','../Buttons/100px/ButtonHome100Ro.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/ButtonHome100.png" alt="Home" name="Home" width="100" height="100" border="0" id="Home" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://charlotte.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Charlotte','../Buttons/100px/ButtonCharRo100.png',1)" onmouseover="MM_nbGroup('over','Charlotte','../Buttons/100px/ButtonCharRo100.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/ButtonCharlotte100.png" alt="Charlotte" name="Charlotte" width="100" height="100" border="0" id="Charlotte" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://marc.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Marc','../Buttons/100px/ButtonMarcRo100.png',1)" onmouseover="MM_nbGroup('over','Marc','../Buttons/100px/ButtonMarcRo100.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/ButtonMarc100.png" alt="Marc" name="Marc" width="100" height="100" border="0" id="Marc" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://marco.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Marco','../Buttons/100px/ButtonMarcoRo100.png',1)" onmouseover="MM_nbGroup('over','Marco','../Buttons/100px/ButtonMarcoRo100.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/ButtonMarco100.png" alt="Marco" name="Marco" width="100" height="100" border="0" id="Marco" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://mats.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Mats','../Buttons/100px/ButtonMatsRo100.png',1)" onmouseover="MM_nbGroup('over','Mats','../Buttons/100px/ButtonMatsRo100.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/ButtonMats100.png" alt="Mats" name="Mats" width="100" height="100" border="0" id="Mats" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://miriam.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Miriam','../Buttons/100px/ButtonMiriRo100.png',1)" onmouseover="MM_nbGroup('over','Miriam','../Buttons/100px/ButtonMiriRo100.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/ButtonMiri100.png" alt="Miriam" name="Miriam" width="100" height="100" border="0" id="Miriam" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://werner.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Werner','../Buttons/120px/ButtonWernerRo120.png',1)" onmouseover="MM_nbGroup('over','Werner','../Buttons/120px/ButtonWernerRo120.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/120px/ButtonWerner120.png" alt="Werner" name="Werner" width="130" height="130" border="0" id="Werner" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://yannick.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Yannick','../Buttons/100px/ButtonYannickRo100.png',1)" onmouseover="MM_nbGroup('over','Yannick','../Buttons/100px/ButtonYannickRo100.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/ButtonYannick100.png" alt="Yannick" name="Yannick" width="100" height="100" border="0" id="Yannick" onload="" /></a></td>
</tr>
<tr>
<td><a href="http://fussball.derheuerclan.de" target="_top" onclick="MM_nbGroup('down','group1','Fussball','../Buttons/100px/Fussball100.png',1)" onmouseover="MM_nbGroup('over','Fussball','../Buttons/100px/Fussball100.png','',1)" onmouseout="MM_nbGroup('out')"><img src="../Buttons/100px/Fussball100.png" alt="Fussball" name="Fussball" width="100" height="100" border="0" id="Fussball" onload="" /></a></td>
</tr>
</table>
<div align="right">
<table width="100" border="0" cellspacing="0">
<tr>
<td><a href="http://amsterdam.derheuerclan.de" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Amsterdam','','Buttons/100px/ButtonAmsterdamRo100.png',1)"><img src="Buttons/100px/ButtonAmsterdam100.png" alt="Amsterdam" name="Amsterdam" width="100" height="100" border="0" id="Amsterdam" /></a></td>
</tr>
<tr>
<td><a href="http://usa.derheuerclan.de" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('USA','','Buttons/100px/ButtonUSA100Ro.png',1)"><img src="Buttons/100px/ButtonUSA100.png" alt="USA" name="USA" width="100" height="100" border="0" id="USA" /></a>
<td>
</tr>
</table>
</div>
</body>
</html>
Ich danke euch schon jetzt für die Hilfe
Gruß
Marc
Hi,
Bin gerade dabei meine erste HP zu erstellen und komme an einem Punkt nicht weiter.
Tust du uns und vor allem dir bitte den Gefallen, das MM_-JavaScript-Geraffel komplett über Bord zu werfen? Das ist absolut grausames Zeug.
Ich habe links eine Navigationsleiste und möchte nun eine weitere am rechten Rand anlegen. Irgendwie bekomme ich es nicht hin das sie rechts anliegt. Die Leiste/Tabelle hängt sich immer ans untere Ende der Seite dran.
Da du im Bereich CSS gepostet hast, nahm ich an, du hättest ein Float-Problem. Ich sehe allerdings kaum was anderes als eine Tabelle.
Es wäre super wenn ihr euch das ganze mal anseht und mir vielleicht helfen könnt.
Grundlagen für Spaltenlayout mit CSS im SELFHTML Aktuell Weblog ist ein hervorragender Artikel darüber, wie man Spaltenlayout zeitgemäß umsetzt. Bitte arbeite ihn aufmerksam und vollständig durch.
MfG ChrisB
Mahlzeit marcham,
zusätzlich zu ChrisB ernstzunehmenden Hinweisen hätte ich da auch noch was:
Hier der Link: http://werner.derheuerclan.de
Das ist kein Link. Das ist einfacher Text. Wie Du hier im Forum einen Link einfügst, erfährst Du in der Forums-Hilfe.
Abgesehen davon enthält die "verlinkte" Seite 12 Fehler - behebe diese im Rahmen Deiner Renovierungsarbeiten (die ChrisB ja andeutete).
MfG,
EKKi