Hat denn niemand eine Idee??
Beiträge von drefman
-
-
...leider gibt es hier keine änderung,,,
-
wie hast du denn das hingekriecht?
-
hallo, danke für euren tipps:
ich brauche die li id um den korrekten hover effekt für jede unterschiedliche grafik auszutauschen. leider hat das mit dem padding: o; nichts genutzt. ich habe es jetzt noch viel komplizierter gemacht und eine eigenes ie stylesheet geschrieben. jetzt funktioniert es in IE 6 aber nicht in IE 7:http://www.manfredgottert.de/test/index_neu.html
-
hallo,
ich möchte eine einfache vertikale Navigation, die nur aus Grafiken besteht incl. hover bauen. Das ganze funktioniert im IE leider nicht (IE 6 und 7), da die Grafiken einen nicht gewollten Abstand untereinander aufweisen (nicht im Firefox).
Wer weiss, wie ich dieses Problem löse. Bin leider nicht besonders programmiertechnisch versiert:Code
Alles anzeigen* { margin: 0; padding: 0; } body { background: #fff url(images/a.jpg) no-repeat 400px 200px; } #wrapper { margin: 0; text-align: left; width: 794px; } p { text-align: left; color: #000; font: 12px/14px "Verdana, Lucida Grande", Lucida, sans-serif; } #nav { float: left; width: 184px; background-color: #ccc; } #content { float: right; width: 600px; background-color:: #666; } #hauptcontent { float: left; width: 400px; background-color: #6b00cd; } #navcontent { float: right; width: 200px; background-color: #00ff97; } #navigation a { background: url(images/a.gif) no-repeat; display:block; width:184px; /* Linkbereich begrenzen */ } #navigation img { display:block; width:184px; height:192px; border:0; } #navigation a:hover img { visibility: hidden; } #navigation a:hover { /* Workaround fuer IE 5.5 und 6 */ border:0; } * html #navigation a { margin-right:1px; } * html #navigation a:hover { width:185px; margin-right:0; /* Workaround fuer IE 5.01 */ } #navigationw a { background: url(images/w.gif) no-repeat; display:block; width:184px; /* Linkbereich begrenzen */ } #navigationw img { display:block; width:184px; height:191px; border:0; } #navigationw a:hover img { visibility: hidden; } #navigationw a:hover { /* Workaround fuer IE 5.5 und 6 */ border:0; } * html #navigationw a { margin-right:1px; } * html #navigationw a:hover { width:185px; margin-right:0; /* Workaround fuer IE 5.01 */ } #navigationu a { background: url(images/u.gif) no-repeat; display:block; width:184px; /* Linkbereich begrenzen */ } #navigationu img { display:block; width:184px; height:192px; border:0; } #navigationu a:hover img { visibility: hidden; } #navigationu a:hover { /* Workaround fuer IE 5.5 und 6 */ border:0; } * html #navigationu a { margin-right:1px; } * html #navigationu a:hover { width:185px; margin-right:0; /* Workaround fuer IE 5.01 */ } #navigationv a { background: url(images/v.gif) no-repeat; display:block; width:184px; /* Linkbereich begrenzen */ } #navigationv img { display:block; width:184px; height:195px; border:0; } #navigationv a:hover img { visibility: hidden; } #navigationv a:hover { /* Workaround fuer IE 5.5 und 6 */ border:0; } * html #navigationv a { margin-right:1px; } * html #navigationv a:hover { width:185px; margin-right:0; /* Workaround fuer IE 5.01 */ }
HTML
Alles anzeigen<!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></title> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/> <link rel="stylesheet" type="text/css" href="style.css"/> </head> <body> <div id="wrapper"> <div id="nav"> <ul> <li id="navigation"><a href="aktuelles.html"><img src="images/a_.gif" alt="Aktuelles" /></a></li> <li id="navigationw"><a href="wir.html"><img src="images/w_.gif" alt="Über uns" /></a></li> <li id="navigationu"><a href="projekte.html"><img src="images/u_.gif" alt="Unsere Projekte" /></a></li> <li id="navigationv"><a href="presse.html"><img src="images/v_.gif" alt="Presse" /></a></li> </ul> </div> <div id="content"> <div id="hauptcontent">...</div> <div id="navcontent">...</div> </div> </div> </body> </html>
-
-
http://www.wachstumstrend.de funktioniert überall ausser auf dem IE 6. der verschiebt die rechte spalte "rechts" in eine neue zeile. hat jemand einen tipp, was ich da machen könnte. für jede hilfe bin ich total dankbar.
hier das script:
<style type="text/css" media="screen">/* layer*/
#box {
width:965px;
margin: 0px auto;
padding:0px;
text-align:left;
}#links {
width:220px;
padding:0px;
margin:10px 0px 10px 10px;
background-color:#94c196;
border: 1px solid #000000;
float:left;
}#press {
padding:0px;
margin:5px 5px 5px 5px;
background-color:#FFFF99;
border: 1px solid #000000;
}#inhalt {
width:486px;
padding:0px;
margin:10px;
float:left;
}#inhalt1 {
width:486px;
border: 1px solid #000000;
padding:0px;
background-color:#cc3333;
margin:0px 0px 10px 0px;
}#inhalt2 {
width:486px;
border: 1px solid #000000;
padding:0px;
background-color:#669999;
margin:0px 0px 10px 0px;
}#inhalt3 {
width:486px;
border: 1px solid #000000;
padding:0px;
background-color:#FFCC66;
margin:0px 0px 10px 0px;
}#inhalt4 {
width:486px;
border: 1px solid #000000;
padding:0px;
background-color:#ff9999;
margin:0px 0px 10px 0px;
}#rechts {
width:215px;
padding:0px;
margin:10px 0px 0px 0px;
float:left;}#rechts1 {
width:215px;
border: 1px solid #000000;
padding:0px;
margin:0px 0px 10px 0px;
background-color:#d6ebd6;}
#rechts2 {
width:215px;
border: 1px solid #000000;
padding:0px;
margin:0px 0px 10px 0px;
background-color:#add6ad;}
#rechts3 {
width:215px;
border: 1px solid #000000;
padding:0px;
margin:0px 0px 10px 0px;
background-color:#d6ebd6;}
--></style>
Beitrag bearbeiten/löschen