nicht angemeldet Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Patrick Andrieu
Hallo!
Ich hab eine Website mit css aufgebaut. nun hab ich das problem, dass im IE 6 und im Firefox die Seiten immer wieder verschoben werden. Aber im IE 7 stellt es die Site korrekt dar!Kann mir da jemand helfen?
die site ist anzusehen unter:
http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/indextanja_grau.htm
Hi !
Du meinst sicherlich Deine Menüleiste unten ?
Einfach das rechte Bild als rechts ausgerichtetes Bild mit ins Menü nehmen, und das Inhaltsframe vergrößern (auf 380px siehts gut aus), so ist das Menü immer zum unteren Rand gedrückt und kann sich nicht mehr bewegen.
Höhenunterschiede im IE/FF kommen meistens weil man im FF noch die Symbolleisten hat, das hat Auswirkungen auf Angaben in % !!
Chris
hi!
erst mal danke für die schnelle antwort!
hab das jetzt mal bei "studio" und "preisliste" geändert....schau mal was da jetzt passiert!?
Ich mein eigentlich, dass es mir bei manchen seite einfach den Bereich von #Inhalt nach unten vergrößert, obwohl es das gar nicht braucht. und es dann automatisch auch die navi nach unten verschiebt....
lg anja
Hi !
Du meinst sicherlich Deine Menüleiste unten ?
Einfach das rechte Bild als rechts ausgerichtetes Bild mit ins Menü nehmen, und das Inhaltsframe vergrößern (auf 380px siehts gut aus), so ist das Menü immer zum unteren Rand gedrückt und kann sich nicht mehr bewegen.Höhenunterschiede im IE/FF kommen meistens weil man im FF noch die Symbolleisten hat, das hat Auswirkungen auf Angaben in % !!
Chris
Hi, uff .. das kann aber jetzt total viele Gründe haben, Du hast auch Fehler im Code, z.B. darf bei einem Bild das alt="" nicht fehlen:
Tabellenhöhen müssen über CSS definiert werden, am besten eh immer alles in CSS machen ! :
<table style="height:300px;width:100%;"></table>
Und in Deinen CSS Befehlen musste bei Maßen immer darauf achten das eine Maßeinheit mit angegeben wird, also nicht einfach so wie Du es hast z.B. 1 1 1em <-- da kennt er 1 1 nicht, richtig ist : 1px 1px 1em , genauso wird 0 nicht erkannt (aber trotzdem von manchen Browsern richtig interpretiert, aber trotzdem drauf achten)
Leider stehe ich zur Zeit auch unter Zeitdruck mit einem Projekt und kann daher nicht mit einem kurzem Blick den Fehler finden, (ich ärgere mich auch andauernd mit diesen Browser-Interpretationsfehlern rum), bin aber sicher, dass es nur eine Kleinigkeit ist, die Du übersehen hast (wie immer *gg*)
Empfehlen kann ich www.css4you.de
Da siehst Du eine Liste mit allen CSS Befehlen und die Kompatibilität mit den ganzen Browsern, einfach mal schauen ob da von Dir benutzte Befehle vom IE oder FF nicht unterstützt werden !!
Chris
hi!
erst mal danke für die schnelle antwort!
hab das jetzt mal bei "studio" und "preisliste" geändert....schau mal was da jetzt passiert!?Ich mein eigentlich, dass es mir bei manchen seite einfach den Bereich von #Inhalt nach unten vergrößert, obwohl es das gar nicht braucht. und es dann automatisch auch die navi nach unten verschiebt....
lg anja
Hi !
Du meinst sicherlich Deine Menüleiste unten ?
Einfach das rechte Bild als rechts ausgerichtetes Bild mit ins Menü nehmen, und das Inhaltsframe vergrößern (auf 380px siehts gut aus), so ist das Menü immer zum unteren Rand gedrückt und kann sich nicht mehr bewegen.Höhenunterschiede im IE/FF kommen meistens weil man im FF noch die Symbolleisten hat, das hat Auswirkungen auf Angaben in % !!
Chris
Phu, ich kenn mich nicht so super aus mit css. glaub ich werd nur eine div-ebene machen und dann das andere aus tabellen machen. oder was meinst?
Hi, uff .. das kann aber jetzt total viele Gründe haben, Du hast auch Fehler im Code, z.B. darf bei einem Bild das alt="" nicht fehlen:
Tabellenhöhen müssen über CSS definiert werden, am besten eh immer alles in CSS machen ! :
<table style="height:300px;width:100%;"></table>
Und in Deinen CSS Befehlen musste bei Maßen immer darauf achten das eine Maßeinheit mit angegeben wird, also nicht einfach so wie Du es hast z.B. 1 1 1em <-- da kennt er 1 1 nicht, richtig ist : 1px 1px 1em , genauso wird 0 nicht erkannt (aber trotzdem von manchen Browsern richtig interpretiert, aber trotzdem drauf achten)
Leider stehe ich zur Zeit auch unter Zeitdruck mit einem Projekt und kann daher nicht mit einem kurzem Blick den Fehler finden, (ich ärgere mich auch andauernd mit diesen Browser-Interpretationsfehlern rum), bin aber sicher, dass es nur eine Kleinigkeit ist, die Du übersehen hast (wie immer *gg*)
Empfehlen kann ich www.css4you.de
Da siehst Du eine Liste mit allen CSS Befehlen und die Kompatibilität mit den ganzen Browsern, einfach mal schauen ob da von Dir benutzte Befehle vom IE oder FF nicht unterstützt werden !!Chris
hi!
erst mal danke für die schnelle antwort!
hab das jetzt mal bei "studio" und "preisliste" geändert....schau mal was da jetzt passiert!?Ich mein eigentlich, dass es mir bei manchen seite einfach den Bereich von #Inhalt nach unten vergrößert, obwohl es das gar nicht braucht. und es dann automatisch auch die navi nach unten verschiebt....
lg anja
Hi !
Du meinst sicherlich Deine Menüleiste unten ?
Einfach das rechte Bild als rechts ausgerichtetes Bild mit ins Menü nehmen, und das Inhaltsframe vergrößern (auf 380px siehts gut aus), so ist das Menü immer zum unteren Rand gedrückt und kann sich nicht mehr bewegen.Höhenunterschiede im IE/FF kommen meistens weil man im FF noch die Symbolleisten hat, das hat Auswirkungen auf Angaben in % !!
Chris
Hallo Anja und auch Chris!
Bitte nicht jedesmal den kompletten Text vom Vorgänger übernehmen! Zitiert nur die Stellen, auf die ihr Euch bezieht, und löscht den Rest!
Phu, ich kenn mich nicht so super aus mit css. glaub ich werd nur eine div-ebene machen und dann das andere aus tabellen machen. oder was meinst?
Ich verstehe nicht, was Du im Eröffnungsposting mit »verschoben« meinst.
Viele Grüße aus Frankfurt/Main,
Patrick
Hallo!
Ich verstehe nicht, was Du im Eröffnungsposting mit »verschoben« meinst.
ich mein damit dass sich der div-tag "inhalt" bei manchen seiten nach untenhin vergrößert, obwohl es das gar nicht braucht. außerdem habe ich jede seite gleich aufgebaut und bei manchen funktionierts, bei den anderen nicht.
und wenn es diesen bereich nach unten hin vergrößert, verschiebt sich auch die linkleiste weiter nach unten....
lg anja
Hallo anja!
und wenn es diesen bereich nach unten hin vergrößert, verschiebt sich auch die linkleiste weiter nach unten....
OK, ich hab's jetzt gesehen. Bevor sich jemand an Deinem Code 'rantraut, solltest Du aber zunächst alle Fehler beseitigen:
Dann (Seite studio_grau.html):
Warum der Mischmasch von DIV-Elementen und Tabellen? Dein Layout dürfte sich nur mit wenigen DIVs bewerkstelligen lassen. Und packe alle CSS-Anweisungen in nur _einem_ Style-Block (wenn alles OK ist, in eine CSS-Datei auslagern). Deine Arbeit ist so ziemlich unübersichtlich, ich schätze, für Dich auch ;)
Wenn Du den Überblick behalten willst, darfst Du gerne Bereiche im Style-Block durch Kommentare trennen:
/* Formatierungen für Banner */
div#foobar {
...
...
}
/* Formatierung für Fussleiste */
div#blablub {
...
...
}
Viele Grüße aus Frankfurt/Main,
Patrick
Hallo!
Erst mal danke für deine Hilfe!
OK, ich hab's jetzt gesehen. Bevor sich jemand an Deinem Code 'rantraut, solltest Du aber zunächst alle Fehler beseitigen:
[link:http://validator.w3.org/check?uri=http%3A//www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm
werde die Fehler jetzt schnell mal beseitigen.
Dann (Seite studio_grau.html):
Warum der Mischmasch von DIV-Elementen und Tabellen? Dein Layout dürfte sich nur mit wenigen DIVs bewerkstelligen lassen. Und packe alle CSS-Anweisungen in nur _einem_ Style-Block (wenn alles OK ist, in eine CSS-Datei auslagern). Deine Arbeit ist so ziemlich unübersichtlich, ich schätze, für Dich auch ;)
ich brauch die Tabellen um den Text und die Bilder zu positionieren.
Wie zB auf der seite preisliste, oder auf der Seite Nagelstudio.... oder wie würdest du das machen?
Wenn Du den Überblick behalten willst, darfst Du gerne Bereiche im Style-Block durch Kommentare trennen:
ja werd ich machen!
lg anja
hab mir das mit den fehlern angeschaut. aber laut validator hab ich zB vergessen den HEAD-Tag zu schließen und die anführungszeichen bei dem Attribut "HEIGHT". Was aber gar nicht stimmt!?
lg anja
also ich hab die Datei studio_grau.htm jetzt mal so abgeändert wie die du gesagt hast...
lg anja
Hallo anja!
also ich hab die Datei studio_grau.htm jetzt mal so abgeändert wie die du gesagt hast...
Sieht schon besser aus im Style-Block. Leider validiert die Seite noch nicht, weil keine Angabe zur Zeichen-Codierung gemacht wurde.
Füge im head-Bereich noch:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
hinzu. Dann entfällt auch die Fehlermeldung: »end tag for "HEAD" which is not finished«. Ach ja, und ein <title>...</title> wäre auch nicht schlecht (wenn auch für den Validator irrelevant).
Die andere, verbleibende Meldung, dass es kein Attribut »height« für Tabellen gibt, erübrigt sich von selbst, wenn Du auf die Tabellen, die Du für die Darstellung nicht brauchst*, verzichtest.
Tabellen sind für tabellarische Daten gedacht, nicht fürs Layouten. Mit Tabellen kannst Du Zeitpläne, Preislisten mit Beschreibungen, usw. realisieren.
ich brauch die Tabellen um den Text und die Bilder zu positionieren.
Nein. CSS bietet genug Möglichkeiten zur Positionierung. Deine Tabellen mit den kuscheligen »Blümchenlinks«, die als Navigation dienen, lassen sich mit einer horizontal formatierten Liste realisieren.
Listen: http://de.selfhtml.org/html/text/listen.htm
Kleiner Vorschlag. Wir betrachten jetzt diese Seite als eine Testseite (denn sie ist noch so schön inhaltsleer). Wenn Du sie mit unserer Hilfe ordentlich gestaltest, kannst Du das CSS in eine externe Datei auslagern, sie gilt dann für alle anderen Seiten (die ja alle gleich aussehen, so weit ich gesehen habe). Ändrungen im HTML-Konstrukt musst Du natürlich auch in die anderen Seiten übernehmen.
Wozu ist die Datei »styles.css«?
Viele Grüße aus Frankfurt/Main,
Patrick
Die andere, verbleibende Meldung, dass es kein Attribut »height« für Tabellen gibt, erübrigt sich von selbst, wenn Du auf die Tabellen, die Du für die Darstellung nicht brauchst*, verzichtest.
aber wie würdest du dann zB die Seite Nageldesign, oder die Seite Preisliste gestalten?
Nein. CSS bietet genug Möglichkeiten zur Positionierung. Deine Tabellen mit den kuscheligen »Blümchenlinks«, die als Navigation dienen, lassen sich mit einer horizontal formatierten Liste realisieren.
muss ich da einfach zB <menu><li> dann die ganzen links </li> ??
weil dann gibt es mir einen aufzählungspunkt vor den ersten link. und kann ich da auch den abstand zwischen den links verändern?
Wozu ist die Datei »styles.css«?
da hab ich die verschiedenen schriftarten definiert (zB für Überschriften, für inhaltstext, aufzählungen,...)
lg anja
und das was sonst im css-bereich steht stimmt alles?
wie zB die margin und padding geschichten, da kenn ich mich nämlich nicht ganz aus was ich hinschreiben soll wenn es 0 ist, weil das wird ja nicht von allen browsern unterstützt hab ich gehört. oder ob ich px oder em schreiben muss...
und diese div-bereiche haben jetzt auch fix diese größe? also vergrößern sich auch nicht, wie es der fall war?
Hallo anja!
Versuch bitte Deine Fragen nicht auf verschiedenen Postings zu verteilen, halte vielleicht 20mn inne, und poste alle Frage in einem Beitrag ;)
und das was sonst im css-bereich steht stimmt alles?
Ich habe mir nicht im Detail alles angesehen, aber einige Unstimmigkeiten sind da schon zu finden. Sollte ich alles begutachten, müsste ich Dir allerdings eine Webseitenanalyse berechnen ;)
Zum Beispiel diese Angabe (wir reden immer noch von studio_grau.html):
p#Fusszeile {
clear:both;
margin-bottom: 0; padding: 0em;
text-align: bottom left;
position:absolute;
}
Wo ist ein p-Element mit der ID »Fusszeile«? Ich sehe ein div-Element mit einer ID diesen Namens.
Dann die Formatierung für das DIV mit der ID »Seite«:
background-color:#FFFFFF;
background-position:bottom right;
background-repeat:no-repeat;
Was soll denn rechts unten positioniert werden? Da wird kein Hintergrundbild referenziert...
wie zB die margin und padding geschichten, da kenn ich mich nämlich nicht ganz aus
Das sieht man auch, du machst für »Seite« zwei padding-Angaben:
padding: 0 auto;
height:530px;
padding: 0;
Wenn Du 0 angibst, brauchst Du in der Tat keine Einheitsangabe (also kein px, em, % o.Ä) - aber nur dann. Die Frage px oder em hängt davon ab, ob Dein Layout fest bleiben soll (px) oder mitwachsen soll (em), wenn der User die Schriftgröße ändert.
A propos Schriftgröße ändern... schau mal im IE 6 was mit dem Banner passiert, wenn Du über den Menüpunkt Ansicht/Schriftart die Schritgröße größer einstellst... Siehst Du's?
Der Grund ist die Überschrift h1. Eine Überschrift soll ja auch eine Überschrift sein, und m.M.n auch Text enthalten. Soll da nur ein Hintergrundbild zu sehen sein, nimm dazu ein anderes Element - zum Beispiel div. Oder einfach als Bild einbinden!
Nun zu der Liste. So könnte Deine Blümchennavi aussehen:
<div id="Fusszeile">
<ul id="navi" style="border:1px solid red">
<li><a href="http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm"><img src="studio_grau-Dateien/studio.gif" border="0" height="59" width="60"></a></li>
<li><a href="http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/nageldesign_grau.htm"><img src="studio_grau-Dateien/nageldesign.gif" border="0" height="60" width="70"></a></li>
<li><a href="http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/preisliste/preisliste_grau.htm"><img src="studio_grau-Dateien/preis_liste.gif" border="0" height="60" width="70"></a></li>
<li><a href="http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/angebote.htm"><img src="studio_grau-Dateien/angebote.gif" border="0" height="60" width="70"></a></li>
<li><a href="http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/uebermich_grau.htm"><img src="studio_grau-Dateien/ueber_mich.gif" border="0" height="60" width="70"></a></li>
<li><a href="http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/g%E4stebuch/gaestebuch.htm" target="_parent"><img src="studio_grau-Dateien/gaestebuch.gif" border="0" height="60" width="70"></a></li>
<li><a href="http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/kontakt_grau.htm"><img src="studio_grau-Dateien/kontakt.gif" border="0" height="60" width="60"></a></li>
</ul>
<img id="logo_bottom" src="studio_grau-Dateien/logo_unten.gif" align="right">
</div>
Im CSS:
ul#navi {float:left;}
ul#navi li {display:inline;}
img#logo_bottom {float:right;}
Und schon ist die Liste horizontal und ohne Bullets im IE, Opera (9) und FF.
nicht weiß, was ich hinschreiben soll wenn es 0 ist, weil das wird ja nicht von allen browsern unterstützt hab ich gehört. oder ob ich px oder
Da hilft SELFHTML!
Viele Grüße aus Frankfurt/Main,
Patrick
hey!
also danke für deinen vorschlag...hab es mittlerweile selber nochmal probiert und auch irgendwie hinbekommen. hoffe es passt so auch.
das mit dem p#Fusszeile soll ein Footer darstellen. weil wenn ich da wie bei den anderen div#Fusszeile schreibe, dann verschiebt es mir alles an den rechten rand rüber.
doch auf der ID-Seite wird das logo rechts unten als hintergrundbild definiert. hatte es zwischenzeitlich mal bei den logos dabei, hab das aber wieder geändert.
muss ich beim padding wenn es 0 ist überhaupt padding angeben? und muss das auto dabei stehen?
danke, hab das bild jetzt ganz normal eingefügt.
jetzt hab ich noch ein problem, und zwar wenn ich bei div#inhalt keine tabelle mache, sondern einfach nur was reinschreib, dann verkleinert sich automatisch gleich der ganze bereich. wie kann ich das machen dass der Inhaltbereich immer gleich groß ist, auch wenn nicht so viel drinnen steht?
oder wie positionierst du in einem div-bereich die texte?
lg anja
Hallo anja!
muss ich beim padding wenn es 0 ist überhaupt padding angeben? und muss das auto dabei stehen?
Nun ja, bestimmte Elemente werden vom Default-Style Sheet des Browsers beeinflußt. So erzeugt <p> einen Zeilenumbruch und einen gewissen Abstand. Den kann man mit margin-Angaben unterbinden (0) oder verändern.
Ach ja, Du solltest Deine Seite in IE 6 und 7, Firefox und Opera testen.
jetzt hab ich noch ein problem, und zwar wenn ich bei div#inhalt keine tabelle mache, sondern einfach nur was reinschreib, dann verkleinert sich automatisch gleich der ganze bereich.
Ich verstehe nicht ganz, was Du da meinst...
wie kann ich das machen dass der Inhaltbereich immer gleich groß ist, auch wenn nicht so viel drinnen steht?
Feste Größe.
oder wie positionierst du in einem div-bereich die texte?
margin, padding...
Ich habe Dir etwas zusammen gebaut: http://www.atomic-eggs.com/z_testdir/studio_grau.htm, das ist zwar noch verbesserungsbedürftig, hilft Dir aber vielleicht weiter. Zum Beispiel sollte das Navi-ul direkt formatiert werden, und muss nicht in einem eigenen DIV gepackt werden.
Das CSS habe ich ziemlich reduziert, naja, schau Dir's an, alles kommentiert... Die graue Linie unten habe ich als border-top vom Navi-Div definiert, die sitzt jetzt zumindest fest.
Validieren würde es auch, wenn ich nicht zu faul wäre, mir alt-Texte für die Bilder auszudenken, das überlasse ich aber Dir ;)
Viele Grüße aus Frankfurt/Main,
Patrick
hallo!
danke für deine bemühungen! ja ich hab die seite schon in IE 6, 7 und Firefox getestet. in IE 7 hat eben alles einwandrei funktioniert nur in IE 6 hat es den Inhaltsbereich immer nach unten hin vergrößert, obwohl es das vom inhalt her gar nicht braucht und somit die linksleiste weiter nach unten verschoben.
bezüglich feste größe, meinst du da position:fixed? weil das wird ja von IE nicht unterstützt.
wieso sollte die navi-ul nicht in einem eigenen div sein?
lg anja
Hallo anja!
ja ich hab die seite schon in IE 6, 7 und Firefox getestet. in IE 7 hat eben alles einwandrei funktioniert nur in IE 6 hat es den Inhaltsbereich immer nach unten hin vergrößert, obwohl es das vom inhalt her gar nicht braucht und somit die linksleiste weiter nach unten verschoben.
Meinst Du hier Deine Version oder mein Beispiel?
bezüglich feste größe, meinst du da position:fixed? weil das wird ja von IE nicht unterstützt.
Nein, position:fixed dient zum Fixieren eines Elements, so dass es nicht mitscrollt. Es wird in der Tat nicht von IE 6 unterstützt, es gibt aber Workarounds (z.B. in SELFHTML) - IE 7 jedoch interpretiert es richtig.
Ich dachte eher an fester Höhe, verbunden mit overflow:auto (falls der Inhalt doch länger wird).
wieso sollte die navi-ul nicht in einem eigenen div sein?
Wo immer ein div-Element nicht notwendig ist, sollte es vermieden werden. In Deinem Fall ließe sich sehr wohl die Liste »standalone« formatieren, also ohne DIV drum herum.
lg anja
Viele Grüße aus Frankfurt/Main,
Patrick
Hallo!
meinte meine version...
fixe höhe geb ich aber einfach zB mit height:300px an, oder? und dann noch overflow:auto bei denjenigem div dazu....!?
lg anja
Hallo anja!
fixe höhe geb ich aber einfach zB mit height:300px an, oder? und dann noch overflow:auto bei denjenigem div dazu....!?
Grrr.... Du hast immer noch diese Tabelle drin! Abgesehen davon ist das Attribut »height« im <table>-Tag nicht erlaubt. Wenn Du, vielleicht für die Preisliste, Tabellen einsetzt, dann solltest Du die Höhe mittels entsprechender CSS-Regel definieren.
Jetzt schau mal, was ich mit fester Höhe meinte. Ich habe in meinem Beispiel mehr Text innerhalb vom DIV »Inhalt« hinzugefügt. Es erscheint eine Scrollleiste (gestern war da noch keiner, gell? Da war auch weniger Text). _Das_ meinte ich mit fester Höhe (für das DIV) und overflow:auto:
http://www.atomic-eggs.com/z_testdir/studio_grau.htm
validiert jetzt, weil ich die fehlenden alt-Attribute in den img-Tags hinzugefügt habe. Ferner habe ich den img-Tags noch ein title-Attribut ohne Wert (title="") verpasst, weil sonst die IEs alt (fälschlicherweise) als Tooltip anzeigen.
Warum kopierst Du Dir das Beispiel nicht und probierst damit herum? Auf Deiner Studio-Seite sind noch so viele Unstimmigkeiten und Fehler:
http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm
http://validator.w3.org/check?uri=http%3A//www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm
Beispiel aus Deinem Quelltext:
<p id="Fusszeile">
<div align="left">
<ul>
<li>
<a href="studio_grau.htm"><img src="links/studio.gif" width="70" height="70" border="0" alt="studio"></a>
<a href="nageldesign_grau.htm"><img src="links/nageldesign.gif" width="70" height="70" border="0" alt="nageldesign"></a>
<a href="preisliste/preisliste_grau.htm"><img src="links/preis_liste.gif" width="70" height="70" border="0" alt="preisliste"></a>
<a href="angebote.htm"><img src="links/angebote.gif" width="70" height="70" border="0" alt="angebote"></a>
<a href="uebermich_grau.htm"><img src="links/ueber_mich.gif" width="70" height="70" border="0" alt="uebermich"></a>
<a href="gästebuch/gaestebuch.htm" target="_parent"><img src="links/gaestebuch.gif" width="70" height="70" border="0" alt="gaestebuch"></a>
<a href="kontakt_grau.htm"><img src="links/kontakt.gif" width="70" height="70" border="0" alt="kontakt"></a>
</li>
</ul>
</div>
</p>
Warum das p-Element hier? Ein div-Element darf nicht innerhalb eines p stehen, aus diesem Grund moniert der Validator: »Line 172, Column 3: end tag for element "P" which is not open.«.
Das p gehört weg, das div bekommt die ID »Fusszeile« und kein align="left", weil es im CSS (s. mein Beispiel) bereits links gefloated wird.
Nach _jeder_ Änderung solltest Du Dir die Seite zunächst in jedem Browser, die Du hast (Opera, FF, IE 6/7) anschauen (zum Beispiel ist bei Deiner studio_grau-Seite die Blümchennavi ganz oben unterm Banner) UND den Validator aufrufen! Er zeigt Dir sofort, was Du falsch gemacht hast.
Wenn Du beide Seiten vergleichst, schau Dir zunächst das HTML an und vergleiche, was anders ist. Dann schau Dir das CSS an und vergleiche auch.
Viele Grüße aus Frankfurt/Main,
Patrick
Hallo Patrick!
Das p gehört weg, das div bekommt die ID »Fusszeile« und kein align="left", weil es im CSS (s. mein Beispiel) bereits links gefloated wird.
Nicht das DIV »Fusszeile« wird gefloated, er hat 100% Breite, sondern die Navigationsliste:
ul#navi {float:left; margin:0 0 0 0;}
ul#navi li {display:inline;}
Das hier:
img#logo_bottom {float:right;}
hatte ich vergessen, zu löschen. Das »tanja«-Logo ist ja jetzt als rechts unten positioniertes Hintergrundbild vom DIV »Seite« definiert.
Viele Grüße aus Frankfurt/Main,
Patrick
ja das hab ich gesehen!
und noch ne frage, wenn ich jetzt keine tabellen verwende und den text positionieren will, kann ich dann margin und padding innerhalb des tags angeben, in diesem beispiel nach <p class="titel" margin...., oder muss ich das in der css-datei definieren?
<div id="Inhalt">
<p class="titel">HIER KOMMEN BILDER VOM STUDIO UND SO WEITER....</p>
</div>
lg anja
Hallo anja!
und noch ne frage, wenn ich jetzt keine tabellen verwende und den text positionieren will, kann ich dann margin und padding innerhalb des tags angeben, in diesem beispiel nach <p class="titel" margin...., oder muss ich das in der css-datei definieren?
Ja. Im CSS:
.titel {
margin: XXpx;
padding: XXpx;
}
oder margin-top, -left, etc, je nach dem, was Du beeinflußen willst. Aber Anja, es steht ALLES in SELFHTML, Kapitel CSS!
Ratsam ist, um zu sehen, wie sich die Dinge verhalten, den Elementen beim Testen immer wieder ein Border zu geben, den man nachher, wenn alles OK ist, entfernt:
<p class="titel" style="border:1px solid yellow">HIER KOMMEN BILDER VOM STUDIO UND SO WEITER....</p>
So siehst Du, was margin und padding bewirken und kannst entsprechend anpassen, was Du willst.
Viele Grüße aus Frankfurt/Main,
Patrick
danke!
werd ich probieren!
lg anja
brauch dringend nochmal deine hilfe!
schaust mir bitte mal die seite studio an.
mir nimmt es nämlich irgendwie die halben sachen die ich in css definiert hab nicht mehr an. kann es sein, dass das mit der ausgelagerten css-datei zu tun hat?
http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm
hat sich alles erledigt....man muss da im css die sachen ein wenig anders angeben!
lg anja
Hallo anja!
brauch dringend nochmal deine hilfe!
Eieiei, das wird noch zum Dauer-Auftrag ;)
mir nimmt es nämlich irgendwie die halben sachen die ich in css definiert hab nicht mehr an. kann es sein, dass das mit der ausgelagerten css-datei zu tun hat?
Nein, aber mit folgendem Fehler:
.seitenwechsel {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #666666;
text-align:right;
margin: 0 10px 0 0;
.titelunterstrichen {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-weight: bold;
font-variant: small-caps;
color: #963053;
text-decoration: underline;
}
Fällt Dir was auf? Tipp: zähl die Klammer...
http://www.hotel-hubertus.at/tanja_neu/seiten/strich_grau/studio_grau.htm
^^ BTW: schau mal in der Forumshilfe nach, wie man hier Verweise einbindet...
Viele Grüße aus Frankfurt/Main,
Patrick
ich bin gestern nicht mehr dazugekommen um mir das anzuschauen, deswegen ist immer noch alles beim Alten!
Werde das jetzt aber ändern....
du hast doch mal was gesagt dass ich css auslagern kann.
muss ich da einfach nur eine neue datei daraus machen und sie dann mit @import..... in jeder datei aufrufen?
lg anja
Hallo anja!
ich bin gestern nicht mehr dazugekommen um mir das anzuschauen, deswegen ist immer noch alles beim Alten!
Ach so...
Werde das jetzt aber ändern....
Genau, probier damit 'rum, wenn Dir diese Testseite dann gelungen ist, bau alle anderen mit dem selben Gerüst und lagere das CSS aus.
du hast doch mal was gesagt dass ich css auslagern kann.
muss ich da einfach nur eine neue datei daraus machen
Du kannst alles in Deine styles.css kopieren und sie dann mit
<link rel="stylesheet" type="text/css" href="styles.css">
in jeder Datei innerhalb von <head></head> einbinden.
Viele Grüße aus Frankfurt/Main,
Patrick
super danke!
meld mich dann wieder wenn ich soweit bin ;)
lg anja
super danke!
meld mich dann wieder wenn ich soweit bin ;)
lg anja
Du hast auch noch einen Anzeigefehler im Content, gib dem #Inhalt noch die CSS Eigenschaften :
So blendet sich eine Scrolleiste automatisch ein wenn der inhalt doch mal länger sein sollte und ragt nicht mehr wie jetzt in das Menü rein !
Gruß,
Chris