Hallo,
Mache gerade meine erste Webseite in CSS DWCS4, und habe ein Problem mit der Darstelung meiner Navigations Buttons. Habe im head ein Bild (volle head grösse) auf die ich zwei Div`s kreiert habe mit rollover u. navigation.
Jedoch werden sie unterschiedlich dargestellt in FF.
Habe Bild eingefügt zur Darstellung.
Safari zeigt alles perfect an, FF verschiebt.
Könntet Ihr mir auch einen hack für IE geben, dort wird das gleiche Problem sein.
Vielen Dank im voraus!
Mein 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">
* { margin: 0; padding: 0; }
<!--
body {
margin: 0;
padding: 0;
text-align: center;
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
background-attachment: scroll;
background-color: #000000;
background-image: url(pictures%20/background%20black%20flower.jpg);
background-repeat: repeat;
background-position: center center;
}
.oneColFixCtrHdr #container {
width: 1280px;
background: #000000;
margin: 0 auto;
border: 1px solid #000000;
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 1px;
}
.oneColFixCtrHdr #header {
background: #DDDDDD;
padding: 0;
}
.oneColFixCtrHdr #header h1 {
margin: 0;
padding: 0;
}
.oneColFixCtrHdr #mainContent {
padding: 0;
background-color: #000000;
}
.oneColFixCtrHdr #footer {
padding: 0;
background:#DDDDDD;
}
.oneColFixCtrHdr #footer p {
margin: 0;
padding: 0;
#apDiv1 {
position:absolute;
left:208px;
top:186px;
width:140px;
height:36px;
z-index:1;
}
#apDiv2 {
position:absolute;
left:1330px;
top:186px;
width:140px;
height:36px;
z-index:2;
}
-->
</style>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
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_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_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 class="oneColFixCtrHdr" onload="MM_preloadImages('pictures /1c blog.jpg','pictures /1c contact.jpg')">
<div id="apDiv1"><a href="http://blog.............com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('blog','','pictures /1c blog.jpg',1)"><img src="pictures /1a blog.jpg" name="blog" width="140" height="35" border="0" id="blog" /></a></div>
<div id="apDiv2"><a href="mailto: info@............com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('contact','','pictures /1c contact.jpg',1)"><img src="pictures /1a contact.jpg" name="contact" width="140" height="35" border="0" id="contact" /></a></div>
<div id="container">
<div id="header">
<h1 align="center"><img src="pictures /Blumen oben Logo.jpg" width="1280" height="223" /></h1>
<!-- end #header --></div>
<div id="mainContent">
Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)