|
|||
![]()
Hallo zusammen,
arbeite gerade an einem CSS Layout und hab ein paar Abstandsprobleme zwischen den Browsern. Hab mal 3 (Windows)Screenshots des Layouts angehangen (IE, Opera, Firefox) Probleme: IE: Da sieht es eigentlich schon so aus wie ichs haben möchte. Einziges Problem ist das der untere Rand unter "Logo" und Banner mit 1px zu sehen ist, was aber nicht sein soll.(s. Bild) Opera: Der rechte Rand der Hauptbox soll eigentlich nur 2px breit sein. Hier ist er aber wesentlich breiter.(s. Bild) Firefox: Ebenfalls das Problem am rechten Rand, und der Hintergrund der Navigation ist auch 1px höher als der Hintergrund bei News (s. Bild) Hier der HTML Code: Code:
<body> <div id="box"> <!--LINKE SPALTE----------------------------------------------------------------------------------!--> <div id="links"> <img src="images/logo.gif" alt="Logo" width="167" height="167" border="0"> <div id="newshead"> <img src="images/newshead.gif" alt="News" width="47" height="20" border="0"> </div><!--/newshead!--> <div id="newscont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> <div id="termhead"><img src="images/termine.gif" alt="Termine" width="75" height="20"></div><!--/termhead!--> <div id="termcont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> </div><!--/links!--> <!--RECHTE SPALTE----------------------------------------------------------------------------------!--> <div id="rechts"> <img src="images/banner.gif" alt="Banner" width="559" height="167" border="0"> <div id="navi"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> </div><!--/navi!--> <div id="content"> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> </div><!--/content!--> </div><!--/rechts!--> <div id="footer"> <ul> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> </ul> </div><!--/footer!--> </div><!--/box!--> </body> Code:
/* CSS */ *{ padding: 0; margin: 0; } body { font-family: Geneva, Verdana, Arial, sans-serif; font-size: 10px; color: #000000; line-height: 1.166; background-color: #b49057; background-image: url(images/body_bg.png); background-repeat: repeat-x; text-align: center; } h3{ font-size: 12px; padding: 3px; } p{ padding: 5px; } #box { margin: 0 auto; background: #ffffff; text-align: center; width: 732px; border: 1px solid #000000; padding: 2px; } /* Linke Spalte */ #links { display: inline; width: 167px; background: #FF0000; float: left; border-bottom: 2px solid white; text-align: left; } #newshead { width: 167px; background: #9a6511; float: left; border-top: 2px solid white; } #newshead img{ margin-left: 3px; } #newscont { width: 167px; background: #00CC00; float: left; border-top: 2px solid white; } #termhead { width: 167px; background: #000000; float: left; border-top: 2px solid white; } #termhead img{ margin-left: 3px; } #termcont { width: 167px; background: #999999; float: left; border-top: 2px solid white; } /* Rechte Spalte */ #rechts { width: 559px; background: #ffffff; float: left; border-left: 2px solid white; border-bottom: 2px solid white; text-align: left; } #navi { width: 559px; background: #000000; border-top: 2px solid white; } #navi img { margin-left: 20px; } #content { width: 559px; background: #ffffff; border-top: 2px solid white; padding-top: 10px; padding-bottom: 10px; } .spalte { display: inline; width: 167px; background: #cccccc; float: left; margin-top: 10px; padding-bottom: 10px; margin-left: 15px; } /* Footer */ #footer { clear: both; width: 728px; background: #000000; color: #ffffff; } #footer ul{ margin: 0; padding: 11px; white-space: nowrap; } #footer li{ display: inline; padding-left: 15px; } #footer a { color: #99630d; font-size: 11px; letter-spacing: 1px; } #footer a:hover { color: #99630d; font-size: 11px; text-decoration: none; } |
Sponsored Links |
|
|||
![]()
Hallo zusammen,
arbeite gerade an einem CSS Layout und hab ein paar Abstandsprobleme zwischen den Browsern. Hab mal 3 (Windows)Screenshots des Layouts angehangen (IE, Opera, Firefox) Probleme: IE: Da sieht es eigentlich schon so aus wie ichs haben möchte. Einziges Problem ist das der untere Rand unter "Logo" und Banner mit 1px zu sehen ist, was aber nicht sein soll.(s. Bild) Opera: Der rechte Rand der Hauptbox soll eigentlich nur 2px breit sein. Hier ist er aber wesentlich breiter.(s. Bild) Firefox: Ebenfalls das Problem am rechten Rand, und der Hintergrund der Navigation ist auch 1px höher als der Hintergrund bei News (s. Bild) Hier der HTML Code: Code:
<body> <div id="box"> <!--LINKE SPALTE----------------------------------------------------------------------------------!--> <div id="links"> <img src="images/logo.gif" alt="Logo" width="167" height="167" border="0"> <div id="newshead"> <img src="images/newshead.gif" alt="News" width="47" height="20" border="0"> </div><!--/newshead!--> <div id="newscont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> <div id="termhead"><img src="images/termine.gif" alt="Termine" width="75" height="20"></div><!--/termhead!--> <div id="termcont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> </div><!--/links!--> <!--RECHTE SPALTE----------------------------------------------------------------------------------!--> <div id="rechts"> <img src="images/banner.gif" alt="Banner" width="559" height="167" border="0"> <div id="navi"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> </div><!--/navi!--> <div id="content"> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> </div><!--/content!--> </div><!--/rechts!--> <div id="footer"> <ul> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> </ul> </div><!--/footer!--> </div><!--/box!--> </body> Code:
/* CSS */ *{ padding: 0; margin: 0; } body { font-family: Geneva, Verdana, Arial, sans-serif; font-size: 10px; color: #000000; line-height: 1.166; background-color: #b49057; background-image: url(images/body_bg.png); background-repeat: repeat-x; text-align: center; } h3{ font-size: 12px; padding: 3px; } p{ padding: 5px; } #box { margin: 0 auto; background: #ffffff; text-align: center; width: 732px; border: 1px solid #000000; padding: 2px; } /* Linke Spalte */ #links { display: inline; width: 167px; background: #FF0000; float: left; border-bottom: 2px solid white; text-align: left; } #newshead { width: 167px; background: #9a6511; float: left; border-top: 2px solid white; } #newshead img{ margin-left: 3px; } #newscont { width: 167px; background: #00CC00; float: left; border-top: 2px solid white; } #termhead { width: 167px; background: #000000; float: left; border-top: 2px solid white; } #termhead img{ margin-left: 3px; } #termcont { width: 167px; background: #999999; float: left; border-top: 2px solid white; } /* Rechte Spalte */ #rechts { width: 559px; background: #ffffff; float: left; border-left: 2px solid white; border-bottom: 2px solid white; text-align: left; } #navi { width: 559px; background: #000000; border-top: 2px solid white; } #navi img { margin-left: 20px; } #content { width: 559px; background: #ffffff; border-top: 2px solid white; padding-top: 10px; padding-bottom: 10px; } .spalte { display: inline; width: 167px; background: #cccccc; float: left; margin-top: 10px; padding-bottom: 10px; margin-left: 15px; } /* Footer */ #footer { clear: both; width: 728px; background: #000000; color: #ffffff; } #footer ul{ margin: 0; padding: 11px; white-space: nowrap; } #footer li{ display: inline; padding-left: 15px; } #footer a { color: #99630d; font-size: 11px; letter-spacing: 1px; } #footer a:hover { color: #99630d; font-size: 11px; text-decoration: none; } |
Sponsored Links |
|
||||
![]()
Wenn der IE es als Einzigster richtig anzeigt, dann hast du einen Fehler im Code!
Gib uns bitte deinen kompletten HTML und CSS Code. Sonst können nichts testen.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ |
|
||||
![]() Zitat:
__________________
Gruss Dieter Vegetarier essen meinem Essen das Essen weg. Und unsere Norweger sind reine Karnivoren. selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS |
|
|||
![]()
Hier die komplette Code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Temp</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8559-1"> <link rel=stylesheet type=text/css href=index.css> <body> <div id="box"> <!--LINKE SPALTE----------------------------------------------------------------------------------!--> <div id="links"> <img src="images/logo.gif" alt="Logo" width="167" height="167" border="0"> <div id="newshead"> <img src="images/newshead.gif" alt="News" width="47" height="20" border="0"> </div><!--/newshead!--> <div id="newscont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> <div id="termhead"><img src="images/termine.gif" alt="Termine" width="75" height="20"></div><!--/termhead!--> <div id="termcont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> </div><!--/links!--> <!--RECHTE SPALTE----------------------------------------------------------------------------------!--> <div id="rechts"> <img src="images/banner.gif" alt="Banner" width="559" height="167" border="0"> <div id="navi"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> </div><!--/navi!--> <div id="content"> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> </div><!--/content!--> </div><!--/rechts!--> <div id="footer"> <ul> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> </ul> </div><!--/footer!--> </div><!--/box!--> </body> </html> Und hier nochmal der CSS Code: Code:
/* CSS */ *{ padding: 0; margin: 0; } body { font-family: Geneva, Verdana, Arial, sans-serif; font-size: 10px; color: #000000; line-height: 1.166; background-color: #b49057; background-image: url(images/body_bg.png); background-repeat: repeat-x; text-align: center; } h3{ font-size: 12px; padding: 3px; } p{ padding: 5px; } #box { margin: 0 auto; background: #ffffff; text-align: center; width: 732px; border: 1px solid #000000; padding: 2px; } /* Linke Spalte */ #links { display: inline; width: 167px; background: #FF0000; float: left; border-bottom: 2px solid white; text-align: left; } #newshead { width: 167px; background: #9a6511; float: left; border-top: 2px solid white; } #newshead img{ margin-left: 3px; } #newscont { width: 167px; background: #00CC00; float: left; border-top: 2px solid white; } #termhead { width: 167px; background: #000000; float: left; border-top: 2px solid white; } #termhead img{ margin-left: 3px; } #termcont { width: 167px; background: #999999; float: left; border-top: 2px solid white; } /* Rechte Spalte */ #rechts { width: 559px; background: #ffffff; float: left; border-left: 2px solid white; border-bottom: 2px solid white; text-align: left; } #navi { width: 559px; background: #000000; border-top: 2px solid white; } #navi img { margin-left: 20px; } #content { width: 559px; background: #ffffff; border-top: 2px solid white; padding-top: 10px; padding-bottom: 10px; } .spalte { display: inline; width: 167px; background: #cccccc; float: left; margin-top: 10px; padding-bottom: 10px; margin-left: 15px; } /* Footer */ #footer { clear: both; width: 728px; background: #000000; color: #ffffff; } #footer ul{ margin: 0; padding: 11px; white-space: nowrap; } #footer li{ display: inline; padding-left: 15px; } #footer a { color: #99630d; font-size: 11px; letter-spacing: 1px; } #footer a:hover { color: #99630d; font-size: 11px; text-decoration: none; } |
|
||||
![]()
Deine Seite ist im "Quirksmodus". DOCTYPE-Switch und seine Auswirkungen
Ein </head> fehlt. Zu dem machst du es dir an vielen Stellen zu kompliziert. Stell doch deine Navigation eine Liste (<ul>) und gebe den <li>-Elemeten die Grafiken als Hintergrund, dann musst du nicht so basteln. Kommentare sehen so aus: Code:
<!-- Kommentar -->
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ |
|
|||
![]()
Danke für die Tips!
Hab jetzt den Doc Type auf Strict gesetzt, allerdings hat sich nichts an den Pixeln Problemen geändert, ausser das jetzt bei Firefox die komplette linke Spalte fehlt. Die Navi wird am Ende aus Roll Over Bildern bestehen. Wollte das mit Java Script machen. Wenn das mit CSS geht wäre natürlich noch besser, aber ich bin noch recht neu im CSS und das übersteigt dann meine Fähigkeiten. ![]() |
|
||||
![]()
Hast du einen korrekten Doctype verwendet oder nur Strict reingeschrieben?
CSS kann auch Navigationen mit "rollover" hinbekommen.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ |
|
|||
![]()
Anbei der neue HTML Code mit dem neuen Strict Code:
Code:
<!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" xml:lang="de"> <html> <head> <title>Temp</title> <link rel=stylesheet type=text/css href=index.css> </head> <body> <div id="box"> <!--LINKE SPALTE----------------------------------------------------------------------------------!--> <div id="links"> <img src="images/logo.gif" alt="Logo" width="167" height="167" border="0"> <div id="newshead"> <img src="images/newshead.gif" alt="News" width="47" height="20" border="0"> </div><!--/newshead!--> <div id="newscont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> <div id="termhead"><img src="images/termine.gif" alt="Termine" width="75" height="20"></div><!--/termhead!--> <div id="termcont"> <img src="images/bild.gif" alt="Bild" width="167" height="167"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> </div><!--/newscont!--> </div><!--/links!--> <!--RECHTE SPALTE----------------------------------------------------------------------------------!--> <div id="rechts"> <img src="images/banner.gif" alt="Banner" width="559" height="167" border="0"> <div id="navi"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> <img src="images/navigation/label_gold.gif" alt="Label" width="49" height="20" border="0"> </div><!--/navi!--> <div id="content"> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> <div class="spalte"> <h3> Headline</h3> <p>Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was es bedeutet, ein blinder Text zu sein: Man macht keinen Sinn. Man wirkt hier und da aus dem Zusammenhang gerissen. </p> <img src="images/bild.gif" alt="Bild" width="167" height="167"> </div><!--/spalte!--> </div><!--/content!--> </div><!--/rechts!--> <div id="footer"> <ul> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> <li><a href="#">Navifoot</a></li> </ul> </div><!--/footer!--> </div><!--/box!--> </body> </html> Der CSS COde ist der selbe wie vorher, da ich ja leider noch nicht weiss was ich ändern muss. Gibt es einen Link zu einem Beispiel wie man eine <ul>Navi programmiert, die mit Image-Rollovers arbeitet? Wäre ja super wenn ich auf Java verzichten kann! ![]() |
Sponsored Links |
|
||||
![]()
Hier: Cascading Style Sheets { Tutorial : Horizontal-Navigation mit gleitenden Hintergründen }
CSS und (X)HTML wird nicht programmiert. ![]()
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ |
Sponsored Links |
![]() |
Themen-Optionen | |
Ansicht | |
|
|
![]() |
||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Benötige Hilfe :( Html / Css Problem? | Stefanie | CSS | 9 | 17.05.2011 19:12 |
CSS verständniss Problem - Brauche Hilfe :) | homeedition | CSS | 3 | 07.12.2008 20:04 |
Hilfe, ich kann nicht mehr ;-) (CSS und runde Ecken ;-)) | Timmi | CSS | 8 | 02.11.2008 14:12 |
Hilfe bei CSS Design | jochen35 | CSS | 3 | 30.10.2006 17:54 |
CSS mit CSS Seiten verlinken !!! BRAUCHE HILFE !!!! | beavis-2005 | CSS | 2 | 16.01.2006 18:10 |