Hallo,
für meine Homepage habe ich CSS aber weiß ist in Firefox grau. wie kann ich das ändern?
Weiß ist in Firefox grau, aber in IE weiß
-
-
Ich hab auch Firefox und bei mir ist weiß auch weiß.
Was hast du denn für einen Farbcode dafür benutzt?
-
#999, #eee, #ddd etc. = grau
#fff = weiss:wink:
-
...also Hexadezimalcodes verwendet er in seiner Styledatei...
Öhm.. kann es sein, dass du das nicht für 'page' und 'content' definiert hast?
Versuch das einfach mal^^
Oder ich hab es übersehen.. =/ -
Abgesehen davon, dass wir dieses Thema schonmal hatten...
-
-
-
ich hab das ; nicht mit kopiert
-
es liegt glaube ich irgendwo anders dran
vielleicht habe ich ein div nicht geschlossen
also ich finde nichts:
SeitePHP
Alles anzeigen<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Computer Clan</title> <link rel="stylesheet" href="styles.css" type="text/css" /> <link rel="shortcut icon" href="images/favicon.ico" type="image/vnd.microsoft.icon"> </head> <body onload="window.setTimeout('ZeitAnzeigen()', 1000)" vlink="blue" link="blue" alink="blue"> <center> <div id="container"> <div id="header"> <h1>Computer Clan</h1> <p>computers have feelings</p> </div> <div id="nav"> <ul> <li><a href="home.php" title="Home">Home</a></li> <li><a href="login.php" title="Login">Login</a></li> <li><a href="gaestebuch.php" title="Gästebuch">Gästebuch</a></li> <li><a href="forum.php" title="Forum">Forum</a></li> <li><a href="downloads.php" title="Downloads">Downloads</a></li> <li><a href="info.php" title="Info">Info</a></li> <li><a title="Sonstiges">Sonstiges</a></li> </ul> </div> </center> <div id="content"> <div id="page"> ............................. </div> </div> <div id="sidebar"> <h4>Uhrzeit und Datum</h4> <script type="text/javascript" src="dhtml.js"></script> <script type="text/javascript"> function ZeitAnzeigen () { var Wochentagname = new Array("Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"); var Jetzt = new Date(); var Tag = Jetzt.getDate(); var Monat = Jetzt.getMonth() + 1; var Jahr = Jetzt.getYear(); if (Jahr < 999) Jahr += 1900; var Stunden = Jetzt.getHours(); var Minuten = Jetzt.getMinutes(); var Sekunden = Jetzt.getSeconds(); var WoTag = Jetzt.getDay(); var Vortag = (Tag < 10) ? "0" : ""; var Vormon = (Monat < 10) ? ".0" : "."; var Vorstd = (Stunden < 10) ? "0" : ""; var Vormin = (Minuten < 10) ? ":0" : ":"; var Vorsek = (Sekunden < 10) ? ":0" : ":"; var Datum = Vortag + Tag + Vormon + Monat + "." + Jahr; var Uhrzeit = Vorstd + Stunden + Vormin + Minuten + Vorsek + Sekunden; var Gesamt = Wochentagname[WoTag] + ", " + Datum + ", " + Uhrzeit; if (DHTML) { if (NS4) { setContent("id", "Uhr", null, '<span class="Uhr">' + Gesamt + "<\/span>"); } else { setContent("id", "Uhr", null, Gesamt); } window.setTimeout("ZeitAnzeigen()", 1000); } } </script> <p><div id="Uhr" class="Uhr"> </div></p> <h4>Login</h4> <form method="post" action="login.php"> <p><table border="0"><tr> <td>Username</td> <td><input type="text" name="name"></td></tr><tr> <td>Passwort</td> <td><input type="password" name="passwort"></td></tr><tr> <td><input class="sender" type="submit" value="login"></td></tr></table></p> </form> <h4>Links</h4> <ul> <li><a target="_blanc" href="http://www.spyka.net" title="Spyka Webmaster resources">Spyka Webmaster</a></li> <li><a target="_blanc" href="http://www.mywebsolution.de" title="My Websolution">My Websolution</a></li> <li><a target="_blanc" href="http://www.phpbox.de" title="PHP Box">PHP Box</a></li> <li><a target="_blanc" href="http://www.php-einfach.de" title="PHP Einfach">PHP Einfach</a></li> <li><a target="_blanc" href="http://berlin.pennergame.de/change_please/462670...07/ " title="Penner Game">Penner Game Spende</a></li> </ul> </div> <div class="clear"> <?php #IP Speicherung $ip = $_SERVER['REMOTE_ADDR']; $eintrag = "".$ip."<br>"; $db = 'iplist.dat'; $datei = fopen($db,"a"); fwrite($datei, $eintrag); ?> </div> <div id="footer"> <p>COMPUTER CLAN © 2010 - Homepage <?php error_reporting(0); $datenbank = "version.dat"; $datei = fopen($datenbank,"r"); fpassthru($datei); ?></p> <p>written by <a href="mailto:philipp_cc@gmx.net">Philipp Escher</a> and <a href="maitlo:felixus123@yahoo.de">Felix Dirrol</a></p> <p>designed by <a href="mailto:philipp_cc@gmx.net">Philipp Escher</a></p> <p><a href="#" onclick="window.print();">Seite drucken</a></p> </div> </div> </body> </html>
CSS-Datei:
Code
Alles anzeigenhtml, * { padding:0; margin:0; } body { background-color:#666666; margin:0 auto; font-size:1.0em; color:#303030; font-family:Geneva, Arial, Helvetica, sans-serif; } /* headers */ h1 { font-size:3.4em; text-align:left; padding-top:20px; padding-left:30px; color:#ffffff; letter-spacing:3px; font-weight:normal; } h2 { font-family:Geneva, Arial, Helvetica, sans-serif; color:#7491A1; } h3 { font-size:1.3em; font-weight:normal; color:#333333; border-bottom:1px solid #DDDDDD; } h4 { background-color:#DDDDDD; border-bottom:1px solid #CCCCCC; padding:5px; color:#999999; } /* paragraphs */ p { margin:2px 0 15px 0; line-height:1.3em; } /* links */ a { color:#333333; border-bottom:1px dotted #333333; text-decoration:none; border:none; } a:hover { color:#7491A1; border-bottom:1px solid #7491A1; } div#footer a { color:#ffffff; text-decoration:underline; border:none; } div#footer a:hover { border:none; } div#sidebar ul li a { color:#999999; border-bottom:1px solid #CCCCCC; font-family:Geneva, Arial, Helvetica, sans-serif; font-size:1.1em; } div#sidebar ul li a:hover { background-color:#DDDDDD; } /* lists */ ul, ol { margin:0 0 5px 30px; } li { list-style-type: none; list-style-position: inside; } /* code */ code { display:block; border:1px solid #cccccc; background-color:#dddddd; padding:15px; margin:5px; } /* container, header and nav */ div#container { background-color:#ffffff; width:70%; padding:0 5px; margin:0 auto; } div#header { background-image:url('images/headerbg.jpg'); background-repeat:no-repeat; background-position:top right; background-color:#000000; height:120px; padding:10px; } div#header p { text-align:left; padding:0 0 0 30px; margin:0; font-size:0.8em; color:#ffffff; } div#nav { background-image:url('images/navbg.jpg'); background-repeat:repeat-x; height:71px; } div#nav ul { margin:0; padding:0; } div#nav ul li { display:block; float:left; } div#nav ul li a { float:left; border:none; padding:25px 15px 0 15px; height:46px; letter-spacing:2px; border-right:1px solid #999999; color:#FFFFFF; text-decoration:none; display:block; } div#nav ul li a:hover { background-color:#333333; } /* content */ div#content { padding:20px 10px 0 10px; } div#page { width:67%; float:left; } div#sidebar { width:28%; float:right; } div#sidebar p { padding:3px 5px; font-family:Geneva, Arial, Helvetica, sans-serif; } div#sidebar ul { list-style:none; margin:7px 12px; } div#sidebar ul li { padding:3px 0; } /* footer */ div#footer { padding:20px 5px; background-color:#636363; color:#ffffff; } div#footer p { font-size:0.6em; font-family:Verdana, Arial, Helvetica, sans-serif; text-align:center; margin:0; padding:5px; } /* generic classes */ .bold { font-weight:bold; } .sender { border: 1px #a9a9a9 solid; margin-top: 1px; margin-right: 1px; margin-bottom: 1px; margin-left: 1px; font-weight: bold; font-size: 11px; color: #000000; line-height: 14px } .clear { clear:both; }
-
Ist immer sinnvoll bei Code-Fragen, Teile des Codes nicht mitzukopieren... Wie soll man dir denn dann helfen?
-
Deine Seite hat 43 Fehler im W3C Validator. Vielleicht löst sich dein Problem, wenn du diese beseitigst.
http://validator.w3.org/ -
Zitat von "phillip e."
...moment, wie war das noch gleich?
Zitat von "Sarkkan"Öhm.. kann es sein, dass du das nicht für 'page' und 'content' definiert hast?
Versuch das einfach mal^^
Oder ich hab es übersehen.. =/
Ok Ich sag dazu einfach mal nichts -
Okay also,
Ich glaube Du hast so im Allgemeinen nicht viel Ahnung von HTML und besonders CSS. Ich habe mir einmal den Code genauer angesehen. Wie schon früher bemerkt hast du dieses Template von einer fremden Seite übernommen. Das ist nicht schlimm, kannst du ruhig machen. Nur ist es so, dass wenn man ein Template nach seinen Wünschen anpassen will, muss man ein Flair für HTML und CSS haben. Jeder Entwickler von solchen Templates hat eine eigene Technik der Layouterstellung. Und um herauszufinden wie der Entwickler vorgegangen ist, muss man schon etwas mehr als nur das HTML-Seminar hier durchgearbeitet haben. Nun zurück zum Thema. Ich sehe genau das wolltest du machen. Du wolltest dieses Template übernehmen und Dir selber gewisse Elemente dazutun oder gewisse Elemente verändern. Weil Du wirklich mehr Übung brauchst, hat sich dieses Vorhaben zu einer Katastrophe entwickelt. Da war einfach alles hinten und vorne nicht richtig. Ist jetzt nicht übertrieben ausgedrückt. Ich bilde mir die Meinung, dass du dich an zu schwierige Sachen wagst. Kannst du mir aus dem Kopf sagen, wie das float-Prinzip funktioniert? Kannst du ein einfaches zweispaltiges Layout erstellen? Kapierst du das Prinzip der Vererbung in CSS? Weisst du eigentlich wann man padding und margin verwenden soll/muss und wann nicht? Das sind ein paar Fragen die man einfach ohne gross zu überlegen beantworten können muss um solche Projekte wie Deine zu verwirklichen. Ich gebe Dir einen Tipp. Gehe wirklich nochmals das Seminar durch. Am Schluss musst Du dich selber abfragen können. Das heisst, das du nach jedem Kapitel kurz Dir selber sagen kannst, was du gelernt hast und die Theorie auch wirklich erklären kannst und auch verstehst was du gerade sagst. Das ist aber noch nicht alles. Theorie alleine nützt dir nichts. Gleichzeitig musst du noch alles ins Praktische übersetzten und ausprobieren. Und damit meine ich nicht, dass Du eine Website erstellst, nein, sondern du machst einzelne Codeschnipsel und experimentierst herum. Nur so lernst Du. Weil wenn ich deinen Code anschaue merke ich einfach, dass du wirklich sehr wenig weisst und auch ziemlich Mühe hast den kleinsten Fehler zu finden. Jetzt gerade in diesem Thread. Wenn du eine solche Website möchtest, müsstest du diesen Fehler auch selbst sehen können.
Nun genug. Ich habe Dir noch den Code überarbeitet:
index.html
HTML
Alles anzeigen<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Computer Clan</title> <link rel="stylesheet" href="design.css" type="text/css" /> <link rel="shortcut icon" href="images/favicon.ico" type="image/vnd.microsoft.icon"> </head> <body> <div id="container"> <div id="header"> <h1>Computer Clan</h1> <span>computers have feelings</span> </div> <div id="nav"> <ul> <li><a href="#" title="#">Home</a></li> <li><a href="#" title="#">Login</a></li> <li><a href="#" title="#">Gästebuch</a></li> <li><a href="#" title="#">Forum</a></li> <li><a href="#" title="#">Downloads</a></li> <li><a href="#" title="#">Info</a></li> <li><a href="#" title="#">Sonstiges</a></li> </ul> </div> <div id="content"> <div id="page"> <div id="page_content"> <h3>Titel h3</h3> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod empor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p> <h3>Titel h3</h3> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod empor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p> </div> </div> <div id="sidebar"> <div id="sidebar_content"> <h4>Uhrzeit und Datum</h4> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p> <h4>Login</h4> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p> <h4>Links</h4> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</p> <ul> <li><a target="_blanc" href="http://www.spyka.net" title="Spyka Webmaster resources">Spyka Webmaster</a></li> <li><a target="_blanc" href="http://www.mywebsolution.de" title="My Websolution">My Websolution</a></li> <li><a target="_blanc" href="http://www.phpbox.de" title="PHP Box">PHP Box</a></li> <li><a target="_blanc" href="http://www.php-einfach.de" title="PHP Einfach">PHP Einfach</a></li> <li><a target="_blanc" href="http://berlin.pennergame.de/change_please/462670...07/ " title="Penner Game">Penner Game Spende</a></li> </ul> </div> </div> <div id="footer"> <p>COMPUTER CLAN © 2010 - Homepage <p>written by <a href="mailto:philipp_cc@gmx.net">Philipp Escher</a> and <a href="maitlo:felixus123@yahoo.de">Felix Dirrol</a></p> <p>designed by <a href="mailto:philipp_cc@gmx.net">Philipp Escher</a></p> <p><a href="#" onclick="window.print();">Seite drucken</a></p> </div> </div> </body> </html>
design.css
Code
Alles anzeigen/* Basis */ * { padding: 0; margin: 0; } body { background-color: #666; min-width: 65.1em; text-align: center; } /* Schriften */ h1 { font-size: 3.4em; padding: 40px 0 5px 20px; color: #fff; letter-spacing: 3px; font-weight: normal; } span { font-size: 1em; padding: 0 0 30px 25px; color: #fff; display: block; } h2 { font-family: Geneva, Arial, Helvetica, sans-serif; color: #7491A1; } h3 { font-size: 1.3em; font-weight: normal; margin: 0 0 20px 0; color: #333333; border-bottom: 1px solid #ddd; } h4 { background-color: #ddd; border-bottom: 1px solid #ccc; padding: 5px; color: #999; } p { line-height: 150%; padding: 0 0 15px 0; } a { color: #333; border-bottom: 1px dotted #333; text-decoration: none; border: none; } a:hover { color: #7491A1; border-bottom: 1px solid #7491A1; } #footer a { color: #fff; text-decoration: underline; border: none; } #footer a:hover { border: none; } #header p { text-align:left; padding:0 0 0 30px; margin:0; font-size:0.8em; color:#fff; } #sidebar ul li a { color: #999999; border-bottom: 1px solid #CCCCCC; font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 1.1em; } #sidebar ul li a:hover { background-color: #ddd; } ul, ol { margin:0 0 5px 30px; } li { list-style-type: none; list-style-position: inside; } #nav ul { margin:0; padding:0; } #nav ul li { display:block; float:left; } #nav ul li a { float:left; border:none; padding:25px 15px 0 15px; height:46px; letter-spacing:2px; border-right:1px solid #999999; color:#999; text-decoration:none; display:block; } #nav ul li a:hover { background-color:#333333; } #sidebar p { padding:3px 5px; font-family:Geneva, Arial, Helvetica, sans-serif; } #sidebar ul { list-style:none; margin:7px 12px; } #sidebar ul li { padding:3px 0; } #footer p { font-size:0.6em; font-family:Verdana, Arial, Helvetica, sans-serif; text-align:center; padding:5px; margin: 0; } /* Layout */ #container { background-color: #fff; width: 65em; padding: 0 10px 0 10px; text-align: left; margin: 0 auto; } #header { background-color: #000; height: auto; } #nav { height: 70px; margin-bottom: 30px; } #content { background-color: #fff; } #page { width: 70%; float: left; } #sidebar { width: 30%; float: right; } #page_content { padding: 0 10px 10px 10px; } #sidebar_content { padding: 0 10px 10px 10px; } #footer { padding: 20px 5px; background-color: #636363; color: #fff; clear: both; margin: 30px 0 0 0; }
-
Ich möchte mich da anschließen.
Es ist nicht so, dass wir dich fertig machen wollen, aber es ist nicht schön, wenn man dir etwas immer wieder sagt mach dies, mach das.
Vielleicht überlegst du dir, dir das was Leute sagen, die sich schon ganz gut auskennen, auch mal wenigstens ansatzweise umzusetzen.Du hast mir schonmal versprochen, dass du das tun wolltest, erinnerst du dich? Weil im Grunde wollen wir dir doch alle nur helfen
LG
-
hab die Farben geändert!
aber jetzt ist der haupttail immer noch nicht in der mitte
Ihr könnt es selbst ausprobieren (erst IE dann FF*)
<!-- m --><a class="postlink" href="http://webspace.dnsalias.net/phome/home.php">http://webspace.dnsalias.net/phome/home.php</a><!-- m -->Ich weiß nicht, was das sein kann.
*FF = Firefox
-
[Problem gelöst]
Lösung:
Ich habe mal <center> und </center> weggelassen! -
Abgesehen davon das dein Design nicht wirklich zusammenpasst und der :hover effekt beim Menu im Internet Explorer8 leider nicht ausgeführt wird. Sieht es jetzt in beiden aktuelen Versionen der Browser gleich aus. bei dir nicht?
EDIT17:48:Zu spät geschrieben, Problem bereits gelöst, alles klar
-
-
-
Der IE kennt den hover-Effekt nur für Links, wenn ich mich nicht irre. Für alles andere muss man nachrüsten
Jetzt mitmachen!
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!