✔ Untere tabelle verschiebt sich bei Firefox

Status
Nicht offen für weitere Antworten.
babone

babone

Mitglied
Hi,

Bei IE wird es aber richtig dargestellt. SUCH ....SUCH Jetzt weiss ich nicht mehr weiter... hoffe Ihr könnt mir weiter helfen.

DIE SEITE http://www.freshandfunky.net/fresh.html

Code ist sehr lang aber Interessant wird es ab Kommentar UNTEN AUFBAU. Ab da wird es bei Friefox veschoben

Danke

Naci

CSS
Code: 
/* CSS Document */
body { background-color: #F2F2F2; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px;
color: #FFFFFF; font-family:Verdana, Arial, Helvetica, sans-serif; letter-spacing:0.4em; font-size:10px;
}

                 /* SCHRIFTEN */

p {
	font: 9px Verdana, Arial, Helvetica, sans-serif;
	padding-left: 8px;
	padding-top:10px;
	color:#7D7D7D;
	letter-spacing: 0.4em;
	font-weight:normal;
	width: 65px;
	height: 13px;
	}
	p.links {
	font: 9px Verdana, Arial, Helvetica, sans-serif;
	padding-left: 8px;
	color:#FFFFFF;
	letter-spacing: 0.4em;
	font-weight:bold;
	padding-top: 5px;
	top: 4px;
	}
	p.Inhalt1 {
	font: 9px Verdana, Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	letter-spacing: 0.4em;
	padding-top: 10px;
	}
	h1 {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	color:#6c6c6c;
	letter-spacing: 0.4em;
	font-weight:bold;
	margin-bottom: 1px;
	margin-left: 19px;
	margin-top: 9px;
	}
	h2 {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	color:#ffffff;
	letter-spacing: 0.4em;
	font-weight:bold;
	margin-bottom: 1px;
	margin-left: 20px;
	margin-top: 0px;
	}


                                          /* MENÜ OBEN */


#nav1t a:link, a:visited {
	color: #ffffff;
	font-weight:bold;
	text-decoration: none;
	}

#nav1t a:hover {
	color: #606060;
	font-weight:bold;
	text-decoration: none;
	}
#UntenR4a a:hover, a:link, a:visited {
    color:#FFFFFF;
	font-weight:bold;
	text-decoration: none;
	}

                                        /* MENÜ LINKS */


 .menu
{
	padding: 0px;
	margin: 0px;
	margin-top: 1px;

}
.menu ul
{
list-style: none;
padding: 0px;
margin: 0px;
text-align: left;
}
.menu li
{
     font-size:10px;
	 letter-spacing:0.4em;
	list-style: none;
	border-top: 4px solid #f5f5f4;
	padding-left:0px;
	margin-left:0px;
	display: block;
	height:13px;
}
.menu a
{
display: block;
background-color: #606060;
color: #ffffff;
font-weight:bold;
text-decoration: none;
width: 128px;
border-left: 5px inset #666666;
}
.menu a:hover
{
display: block;
ext-decoration: none;
color: #fff;
font-weight:bold;
background-color: #fbaa19;
border-left: 5px inset #666666;
}
.menu a:active
{
display: block;
ext-decoration: none;
color: #fff;
font-weight:bold;
background-color: #fbaa19;
border-left: 5px inset #666666;
}

 
                   /* basic elements */
 
 
 
  /* HINTERGRUND */
 
 
#Tabelle_01 { background-color: #f5f5f4; width: 921; height: 100%; border:0; }

#a { background-image:url(images/fresh2bslice1_01.jpg); background-repeat:no-repeat; width: 26px; height:26px;}
#a1 { background-image:url(images/fresh2bslice1_02.jpg); background-repeat:repeat-x; width: 869px; height:26px;}
#a2 { background-image:url(images/fresh2bslice1_04.jpg); background-repeat:no-repeat; width: 25px; height:26px;}
#a3 { background-image:url(images/fresh2bslice1_05.jpg); background-repeat: repeat-y; width: 26px; height:100%;}
#a4 { background-color: #f5f5f4; width: 869px; height: 100%;}
#a5 { background-image:url(images/fresh2bslice1_09.jpg); background-repeat:repeat-y; width: 25px; height:100%;}
#a6 { background-image:url(images/fresh2bslice1_86.jpg); background-repeat:no-repeat; width: 26px; height:30px;}
#a7 { background-image:url(images/fresh2bslice1_87.jpg); background-repeat:repeat-x; width: 869px; height:30px;}
#a8 { background-image:url(images/fresh2bslice1_90.jpg); background-repeat:no-repeat; width: 25px; height:30px;}
#kopf { margin-top: 0; padding-top: 0;}
#kopf1 { background-image: url(images/fresh2bslice1_07.gif); background-position:center; background-repeat:no-repeat; height: 98px;}

 /* OBEN NAVI */
 
 
#nav1 { height: 18px; }
#nav1a { float:left; width: 140px; height: 18px; background-image: url(images/fresh2bslice1_16.gif); background-repeat:no-repeat; }
#nav1b { float:left; width: 23px; height: 18px; background-image: url(images/fresh2bslice1_17.jpg); background-repeat:no-repeat; }
#nav1c { float:left; width: 700px; height: 18px; background-color: #a1a1a1; margin-right: 4px; }
#nav1t { height: 18px; background-color: #a1a1a1; color:#FFFFFF;  font-family:Verdana, Arial, Helvetica, sans-serif; letter-spacing:0.6em; font-size:8px; font-weight: bold; line-height:18px; margin-left: 12px;}


        /* MITTE LAYOUT */

#mittel {
	margin-top: 0;
	padding-top: 0;
	margin-bottom: 0px;
	padding-bottom: 0px;
}
#mlink {
	float:left;
	width: 133px;
	height: 202px;
	background-color: #f5f5f4;
	padding-left:7px;
	padding-bottom: 0px;
	margin-bottom: 0px;
}
#mrechts {
	float:left;
	width: 725px;
	margin-right:#FFFFFF;
	height: 202px;
}

       /* LINKS NAVI */


#mlink1 {background: url(images/fresh2bslice1_20.gif) no-repeat right top; width: 133px; height:7px; font-size:0;}
#mlink2 {
	width: 133px;
	height:15px;
	background: url(images/fresh2bslice1_28.gif) no-repeat right top;
	background-color: #a1a1a1;
	font-size:0;
}
#mlink12 {
	background-color: #a1a1a1;
	width: 133px;
	height:16px;
	background-image:url(images/fresh2bslice1_54.gif);
	background-repeat:no-repeat;
	background-position:right;
	margin-top: 5px;
}
#mlink13 { 
    background-color: #f5f5f4; 
	width: 133px; 
	height: 6px; 
	background: url(images/fresh2bslice1_59.gif) no-repeat right top;
	font-size:0px; }

                          /* mitte rechts  NAVI */


#Tabelle_02 { background-color: #f5f5f4; width: 725px; height: 203px; }
#b1 { background-image:url(images/fresh2bslice1_21.gif); background-repeat:no-repeat; width: 13px; height:14px;}
#b2 { background-image:url(images/fresh2bslice1_22.jpg); background-repeat:no-repeat; width: 701px; height:14px;}
#b3 { background-image:url(images/fresh2bslice1_23.jpg); background-repeat:no-repeat; width: 11px; height:14px;}
#b4 { background-image:url(images/fresh2bslice1_30.jpg); background-repeat:no-repeat; width: 13px; height:173px;}
#b5 {
	background-image:url(images/fresh2bslice1_31.jpg);
	background-repeat:no-repeat;
	width: 701px;
	height:173px;
}
#b6 { background-image:url(images/fresh2bslice1_32.jpg); background-repeat:no-repeat; width: 11px; height:173px;}
#b7 { background-image:url(images/fresh2bslice1_55.jpg); background-repeat:no-repeat; background-position:bottom; width: 13px; height:16px;}
#b8 { background-image:url(images/fresh2bslice1_56.jpg); background-repeat:no-repeat; background-position:bottom; width: 701px; height:16px;}
#b9 { background-image:url(images/fresh2bslice1_57.jpg); background-repeat:no-repeat; width: 11px; height:16px;}
#Oinhalt {
	margin-top: 2px;
	width: 690px;
	height: 169px;
	margin-left: 5px;

}

                          /* UNTEN Aufbau */


#Unten {
	background-color: #f5f5f4;
	width: 869px;
	   }
#Tabelle_03 { background-color: #f5f5f4; width: 858px; height: 100%; border:0; margin-right:4px;
	margin-left:7px;}
#c1 { 
	width: 133px;
	height:24px;
	background: url(images/fresh2bslice1_61.gif) no-repeat right top;
	background-color: #E0E0E0;
	font-size:0;
}
#c2 { 
	width: 20px;
	height:24px;
	background: url(images/fresh2bslice1_62.jpg) no-repeat;
}
#c3 {
	width: 697px;
	height:24px;
	background: url(images/fresh2bslice1_64.jpg) repeat-x top;
	font-size:15px;
	line-height: 15px;
}
#c4 {
    width: 11px;
	height:15px;
	background: url(images/fresh2bslice1_65.jpg) no-repeat;
}
#c5 {
    width: 133px;
	height:100%;
	background-color: #E0E0E0;
}
#c6 { 
    width: 20px;
	height:100%;
	background: url(images/fresh2bslice1_67.jpg) repeat-y left;
}
#c7 { 
    width: 697px;
	height:100%;
	background-color:#E1E1E1;
}
#c8 {
    width: 11px;
	height:100%;
	background: url(images/fresh2bslice1_71.jpg) repeat-y;
}
#c9 {
    width: 133px;
	height:16px;
}
#c9a {
    width: 133px;
	height:10px;
	background: url(images/fresh2bslice1_73.gif) no-repeat right top;
	background-color: #E0E0E0;
	font-size:0;
}
#c9b { 
    width: 133px;
	height:6px;
	background: url(images/fresh2bslice1_81.gif) no-repeat right top;
	background-color: inherit;
	font-size:0px;
}
#c10 { 
    width: 20px;
	height:16px;
	background: url(images/fresh2bslice1_74.gif) no-repeat;
}
#c11 { 
    width: 697px;
	height:16px;
	background: url(images/fresh2bslice1_75.jpg) repeat-x;
}
#c12 { 
    width: 11px;
	height:16px;
	background: url(images/fresh2bslice1_77.jpg) no-repeat;
}
#UntenR4 {
    margin-left:7px;
	width: 858x;
	height:17px;
}
#UntenR4a {
    float:left;
	width: 133px;
	height:17px;
	background: url(images/fresh2bslice1_83.gif) no-repeat right top;
	background-color: #FBAA19;
	color:#FFFFFF;
	line-height: 17px;
	font-weight: bold;
	letter-spacing: 0.6em;
	text-align: center;
	font-size: 8px;
}
#UntenR4b {
	float:left;
	width: 725px;
	height:17px;
	background: url(images/fresh2bslice1_84.gif) no-repeat left top;
	background-color: #606060;
	color:#FFFFFF;
	line-height: 17px;
	font-weight: bold;
	letter-spacing: 0.4em;
	text-align: center;
	font-size: 8px;
	margin-right: 4px;
}
                           /*           UNTEN INHALT               */
   
   
#inhalU {
width:695px;
    
}
#inhalU2 {
width:695px;
    
}
#Uinhalt {
	margin-top: 5px;
	width: 335px;
	height: 140px;
	margin-left: 1px;
	background-color: #999999;
	float: left;
	margin-bottom: 14px;

}
#Uinhalt1 {
	margin-top: 5px;
	width: 345px;
	height: 140px;
	margin-left: 0px;
	float: left;
	margin-bottom: 8px;

}
#Uinhalt2 {
	margin-top: 5px;
	width: 340px;
	height: 140px;
	margin-left: 1px;
	float: left;

}
#Uinhalt3 {
	margin-top: 5px;
	width: 345px;
	height: 140px;
	background-color: #999999;
	float: left;
	margin-bottom: 14px;

}
#titel {
	width: 685px;
	border-bottom: medium #d5d4d4 inset 1px;
	bottom: 0px;
	line-height: 15px;
	background:url(images/feil1.gif) no-repeat left bottom;
	padding-left: 10px;
}
#titela {
	width: 685px;
	border-bottom: medium #cac8c8 inset 1px;
	bottom: 0px;
	line-height: 10px;
	background:url(images/feil.gif) no-repeat left bottom;
	padding-left: 10px;
	padding-top:0;
}
 
Weise mal dem DIV#Unten die clear:left-Eigenschaft zu:

Code: 
#Unten {
clear: left;
margin-top: 0; 
padding-top: 0;
}
 
Danke,
würde mich interresieren wieso ich es bei der oberen tabelle bzw. div nicht brauche...

Ich hätte noch 1 Frage funktioniert bei firefox a.active nicht?

Danke nochmals

Naci
 
  1. Da in der oberen Tabelle die DIVs #kopf1 und #nav1 keine float-Eigenschaft besitzen, ist auch keine clear-Eigenschaft für das nachfolgende Element erforderlich, um es wieder im normalen Textfluss auszurichten.

  2. Die Pseudoklasse :active greift in den meisten Browsern nur bei gedrückter Maustaste.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück