Willkommen Gast. Bitte einloggen oder registrieren.
Haben Sie Ihre Aktivierungs E-Mail übersehen?

Einloggen mit Benutzername, Passwort und Sitzungslänge

 
Erweiterte Suche

5476 Beiträge in 1178 Themen- von 498 Mitglieder - Neuestes Mitglied: Rithaquesri

22.05.2012 10:39
ProfiHost - SupportforumTechnikProgrammiersprachenjetzt hab auch ich es geschnallt
Seiten: [1]   Nach unten
Drucken
Autor Thema: jetzt hab auch ich es geschnallt  (Gelesen 4389 mal)
bryce
Newbie
*
Offline Offline

Beiträge: 45


Profil anzeigen
« am: 31.01.2004 10:47 »

Hallo nochmals,

jetzt isses auch bis zu mir durchgedrungen, was du meintest.

Also ich habs jetzt genau so gemacht. Die Hover mit CSS und die Aktiven Buttons per PHP Dateinamenprüfung.

Danke ... als PHP bzw. überhaupt Programmierer-Anfänger versteht man oft auf Anhieb überhaupt nicht was gemeint ist.

Danke, ehrlich.
Ich bin sehr zufrieden und glaube, eine perfekte Site zu haben :-))

Gruss
Peter
Gespeichert
Netizen
Newbie
*
Offline Offline

Beiträge: 37


Profil anzeigen WWW
« Antworten #1 am: 31.01.2004 11:43 »

Zitat von: "bryce"
jetzt isses auch bis zu mir durchgedrungen, was du meintest.

Also ich habs jetzt genau so gemacht. Die Hover mit CSS und die Aktiven Buttons per PHP Dateinamenprüfung.

Check Deine Seite mal mit Opera oder Mozilla, oben im Menü gibts beim hovern ein paar unschöne Ränder. Das dürfte mit dem CSS zusammenhängen (evtl. mit den height-Werten).

Gruß
n!
Gespeichert
bryce
Newbie
*
Offline Offline

Beiträge: 45


Profil anzeigen
« Antworten #2 am: 31.01.2004 13:43 »

Hai ..

danke .. das stört mich zwar gewaltig .. frage mich jedoch, was soll ich machen.

Ich richte die Site immer fürs Volk aus (IE User), das ist halt mal die deutliche Mehrheit und wenns dann auf den anderen nur im Aussehen ein paar Probleme gibt, dann ist das halt pech, solange Sie die Inhalte ansehen können, reichts finde ich .. zumindes ist das das wichtigste.

Ich wüsste jetzt nicht so richtig was ich da noch lange suchen soll und Browserweichen einbauen etc. ...
wenn solche Sachen vom Kunden gewünscht (also bezahlt) werden dann mache ich das, aber wenns um Geld geht, verschmerzt man (auch als Kunde) vieles !!!

Danke.
Gruss
Peter
Gespeichert
mic
Newbie
*
Offline Offline

Beiträge: 25


Profil anzeigen WWW
« Antworten #3 am: 31.01.2004 15:03 »

hallo,
eigentlich sollte es kein Problem sein, die Hover-Effekte auch für Mozilla & Co richtig zu machen. Dazu ist auch keine Browserweiche notwendig.
Ich würde ebenfalls wie Netizen es mit height: 25px oder mit einer padding-Angabe versuchen. Mit den Änderungen sieht es dann auch in allen Browsern gleich aus, da beim IE wahrscheinlich keine Veränderung zu merken ist.

Gruß, mic

P.S.: Schuld sind aber nicht Firebird, Mozilla, Opera, etc. sondern der IE mit seiner konfusen CSS-Interpretation!!!
Gespeichert

bryce
Newbie
*
Offline Offline

Beiträge: 45


Profil anzeigen
« Antworten #4 am: 31.01.2004 15:32 »

wenn ich die heigt auf 25 stelle (wie tabelle) dann überlappt die tabelle, mit 23 wird es genau passend.

und auf 23 habe ich es auch eingestellt, was vom IE auch korrekt dargestellt wird. Ich verstehe echt nicht warum immer auf dem IE rumgemeckert wird.
Ach hier lasse ich mich gerne eines besseren belehren, aber meine erfahrung ist, dass der IE es korrekt darstellt und die anderen nicht !!!

sag mir mal warum die anderen keine heigt von 23 darstellen, sondern eigentlihc nur die Höhe des Zeichensatzes?? ... und wer macht nun den Fehler IE oder die anderen.

Nochmals, ich lasse es mir echt sehr gerne sagen, aber es ist leider nicht so wie es immer dargestellt wird. Ich richte für den IE aus weil er korrekt darstellt. Es ist doch offensichtlich,das der IE die Height richtig darstellt.

und wenn ich dann die heigt erhöhe, dann stimmt ja der IE nicht mehr. Also ich weiss da ehrlich nicht warum ich noch experimentieren sollt. Weil es wird immer so bleiben dass es entweder der eine oder der andere richtig darstellt.

---
Übrigens: Ich bin nicht sauer (falls es meine Begründung irgendwie genervt klingt). Es ist echt nicht so gemeint, aber es ist halt meine Meinung.

Gruss
Peter

#menu a:link {
   font-size: 14px;
   font-weight: bold;
   color: #666666;
   text-decoration: none;
   height: 23px;
   line-height: 23px;
}
#menu a:hover {
   font-size: 14px;
   font-weight: bold;
   color: #666666;
   text-decoration: none;
   background-color: #ff9900;
   height: 23px;
   line-height: 23px;
}
#menu a:visited {
   font-size: 14px;
   font-weight: bold;
   color: #666666;
   text-decoration: none;
   height: 23px;
   line-height: 23px;

}
Gespeichert
Netizen
Newbie
*
Offline Offline

Beiträge: 37


Profil anzeigen WWW
« Antworten #5 am: 31.01.2004 21:48 »

Zitat von: "bryce"
wenn ich die heigt auf 25 stelle (wie tabelle) dann überlappt die tabelle, mit 23 wird es genau passend.

Solche Pixelschubsereien sind immer problematisch. Gerade wenn das Layout buchstäblich daran hängt, daß Abstände exakt eingehalten werden müssen, gibt es früher oder später Probleme. Im schlimmsten Fall kann eine Seite dadurch komplett unbenutzbar werden (wenn der Benutzer z.B. die Schriftgröße erhöht und sich dadurch Elemente verschieben und überlappen).

Zitat
und auf 23 habe ich es auch eingestellt, was vom IE auch korrekt dargestellt wird. Ich verstehe echt nicht warum immer auf dem IE rumgemeckert wird.

Weil diese Aneinanderreihung ausrangierter Bytes die mit Abstand mieseste HTML- und CSS-Implementation hat. Daß er trotzdem am meisten verwendet wird, ist leider ein trauriger Fakt und somit beim Erstellen von Webseiten zu berücksichtigen.
 
Zitat
Ach hier lasse ich mich gerne eines besseren belehren, aber meine erfahrung ist, dass der IE es korrekt darstellt und die anderen nicht !!!

Und genau das ist der springende Punkt: Wenn etwas im IE gut aussieht, im Opera und Mozilla hingegen nicht, dann ist mit 99%iger Sicherheit etwas verkehrt - und zwar an der Seite! Opera und Mozilla sind so dicht am Standard wie kaum ein anderer Browser, sie stellen nahezu alles korrekt dar. Wenns dann klemmt, ist es nur in sehr seltenen Fällen die Schuld des Browsers.

Zitat
Nochmals, ich lasse es mir echt sehr gerne sagen, aber es ist leider nicht so wie es immer dargestellt wird. Ich richte für den IE aus weil er korrekt darstellt. Es ist doch offensichtlich,das der IE die Height richtig darstellt.

Der IE hat viele Bugs (u.a. kaputtes Boxmodel), von denen sich einige sogar "vernünftig" einsetzen lassen, in anderen Browsern dann aber möglicherweise zu Problemen führen.

Ein Beispiel dafür ist text-align: center - normalerweise nur dafür gedacht, Text bzw. Inline-content innerhalb von Block-Elementen zu zentrieren, der IE zentriert damit hingegen auch andere Block-Elemente (solche werden normalerweise mit margin: auto zentriert). Das ist ein Bug, der sich aber auch "sinnvoll" verwenden läßt, um einen anderen Bug zu umgehen, der IE kann nämlich kein margin: auto.

Solcher Beispiele gibt es noch mehr, dazu kommen noch etliche wichtige und nützliche Dinge, die im IE ganz einfach nicht implementiert sind (z.B. das q-Element sowie diverse CSS-Pseudoklassen und Selektoren), MS weiß offensichtlich besser, was die Benutzer wollen und was nicht ... es gibt also genügend Gründe, auf dem IE rumzuhacken. Zwinkernd

Zitat
und wenn ich dann die heigt erhöhe, dann stimmt ja der IE nicht mehr. Also ich weiss da ehrlich nicht warum ich noch experimentieren sollt. Weil es wird immer so bleiben dass es entweder der eine oder der andere richtig darstellt.

Das sowieso, das ist aber kein Bug, sondern ein Feature des WWW . Kein Browser wird eine Seite exakt so darstellen wie ein anderer, Abweichungen sind immer drin.

Dein jetziges "Problem" sollte sich aber relativ einfach lösen bzw. umgehen lassen, ich hab da jetzt allerdings keine Meinung mehr zu, bin zu müde. Ich guck mir das morgen oder übermorgen nochmal an und poste dann ggf. nochmal hier.

Gruß
n!
Gespeichert
mic
Newbie
*
Offline Offline

Beiträge: 25


Profil anzeigen WWW
« Antworten #6 am: 01.02.2004 16:43 »

hallo,
@bryce: wie in deinen css-styles zu sehen ist, ist doch der IE Schuld! Es wird einfach falsch dargestellt, der Standard wird vom IE überhaupt nicht beachtet.
Also: Eine height-Angabe funktioniert korrekterweise nur bei <div>s oder <p>s, nicht bei inline-Elementen wie <a> oder <span>. Um eine height-Angabe auf ein <a>-Tag anzuwenden, muss die CSS-Eigenschaft display: block; angewendet werden. Dann funktioniert es in allen Browsern gleich, eventuelle <br /> müssen dann natürlich entfernt werden.

@netizen: Der Box-Model-Fehler(bei xhtml) lässt sich übrigens im IE6 umgehen, wenn man den XML-Prolog weglässt. Also kein
<?xml version="1.0"?>, nur
<!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">

Das Dokument ist trotzdem korrektes XHTML.
Einziges Problem: leiderbewirkt dass beim IE5 nichts...
Gespeichert

bryce
Newbie
*
Offline Offline

Beiträge: 45


Profil anzeigen
« Antworten #7 am: 02.02.2004 08:22 »

Hallo...

danke euch beiden...

hmmm .. ich dachte immer CSS wäre einfach. Die Vorgaben machen, dann die Vorgaben auf irgendwas anwenden und fertig! .. naja .. aber auch hier muss man aufpassen auf was man was angwendet. Naja .. ichs versuchs in der Zukunft besser hinzubekommen.

Aber eigentlich weiss ich im Moment nicht so richtig was ich ändern muss.

Ich hab das auf #menu angewendet, oder ?! ..
Vielleicht sollte ich es probieren, die komplette Tabelle auszubauen und alles durch P´s ersetzen. Ich glaube ich kann auch irgendwie steuern dass ein P kein Umbruch macht (was ich ja dann brauche, damit die Menüeinträge nicht untereinander stehen). Dann bräuchte ich auch diese doofe Tabelle nicht.

Danke.
Ich hoffe ich darf bei evtl. Schwierigkeiten nochmals auf euch zurückkommen .. und vielleicht wäre vorab schon ein kleiner Hinweis. Was muss ich in die CSS Datei schreiben um display: block zu erreichen?
Ich dachte height wäre ein block (line-heigt is was anderes das was ich).

hmm

Danke.
Peter
Gespeichert
mic
Newbie
*
Offline Offline

Beiträge: 25


Profil anzeigen WWW
« Antworten #8 am: 02.02.2004 12:00 »

hallo,
also, zur Erklärung von der display-Eigenschaft:

bei <a> und <span> ist die Eigenschaft normalerweise auf display: inline; gestellt. Das bedeutet: es verhält sich wie ein ganz normaler Text und es wird danach nicht umgebrochen.

bei <div> und <p> ist die Eigenschaft standardmäßig auf display: block; gestellt. Es ist also kein Text, sondern ein Container von Text. Danach wird umgebrochen.

Zu deinem Fall: Die Tabelle brauchst du nicht in p's zu ändern. Die Eigenschaft display: block; ist wie auch height: 23px; eine ganz normale CSS-Eigenschaft.
Bei dir muss sie dorthin (Werte schon geändert):

#menu a:link {
font-size: 14px;
font-weight: bold;
color: #666666;
text-decoration: none;
height: 25px;
line-height: 23px;
display: block;
}

Wenn du das so änderst, müsst alles richtig funktioniern...(natürlich kann ich das nicht garantieren L&#228;chelnd)

Zitat
Ich dachte height wäre ein block (line-heigt is was anderes das was ich).

Richtig! Genau da liegt ja der Fehler des IE! Eine height-Angabe ist nur auf einen Block(p und div) anzuwenden, oder auf ein zum Block gemachtes(mit display: block) Element(wie span und a)

Wenn du die Tabelle ersetzen willst:
Dann solltest du keine div's oder p's um jeden einzelnen Link machen sondern zum Beispiel so:
<div><a href="xyz">Link1</a><a href="xyz">Link2</a><a href="xyz">Link1</a><a href="xyz">Link3</a></div>

Die Höhe bekommst du nun so hin:
#menu a {
font: normal bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #666666;
text-decoration: none;
padding: 5px 0px 5px 0px;
}

Die Höhe beträgt dann 24px. 25px gehen schlecht, weil dann der Text nicht mehr in der Mitte steht (also wenn du 5px oben und 6px unten nimmst)...
Mit line-height kann man die Höhe nicht erreichen, da weiß ich aber den Grund nicht genau...

so, hoffe, dass ichs verständlich erklärt hab...

gruß, mic
Gespeichert

bryce
Newbie
*
Offline Offline

Beiträge: 45


Profil anzeigen
« Antworten #9 am: 02.02.2004 14:02 »

Hallo ..

danke nochmals !!!

... aber .. jetzt ist zwar der komplette Hintergrund organge bei over, aber der Text steht nicht mehr vertikal mittig ! .. warum weiss ich auch nicht .. ich habe extr noch ein vertical-align dazugemacht.

#menu a:hover {
   font-size: 14px;
   font-weight: bold;
   color: #666666;
   text-decoration: none;
   background-color: #ff9900;
   height: 23px;
   display: block;
   vertical-align: middle;
}

Hier kapiere ich übrigens nicht immer, ob es auf das übergeordnete DIV oder TABLE angewendet werden muss (der Center Befehl) oder direkt auf das zu zentrierende Element. Das verstehe ich nicht immer.

Also auf jeden Fall ist jetzt die Schrift nicht mehr mittig.

Ausserdem musste ich, wie du siehst, die Höhe auf 25 cm machen. Aber ich denke, das kommt daher, dass ich auch einen Rahmen oben + unten von 2 cm habe. Auch hier weiss ich nicht immer, ob ich das abziehen muss oder nicht?
In diesem Fall musste ich es definitiv abziehen, da sonst das Menü in die orange Linie überlappt hätte, d.h. es wären effetiv 27 px gewesen ..

naja .. das sind so die problemchen mit denen man sich irgenwie rumschlagen muss, aber ich denke, 1 x kapiert -- immer im kopf - hoffe ich.

--
btw: das vertikal-align funktioniert auch beim Logo oben links nicht. Das sollte vertikal mittig patziert werden. Kannst du mir auch hier helfen, warum das nicht vert. mittig ist?

---

hier nochmal die url: http://www.RealityWEB.de

Gruss und danke nochmals.
Peter
Gespeichert
mic
Newbie
*
Offline Offline

Beiträge: 25


Profil anzeigen WWW
« Antworten #10 am: 02.02.2004 15:33 »

hi,
also:
zum mittig zentrieren: vertical-align muss auf das div bzw. table angewendet werden. hier würd ich aber einfach beim a entweder padding hinzunehmen oder line-height auf 23px(bessere Variante, denke ich) setzten....

zur mathematik L&#228;chelnd: (am beispiel der höhe)
1.korrekte interpretation(firebird, mozilla, opera): height+padding+border=gesamthöhe

2.falsche interpretation(IE5, IE6(interpretiert nur wie bei 1. wenn der XML-Prolog weggelassen wird. wenn kein DOCTYPE steht, weiß ich es nicht)
height=gesamthöhe
(padding und border werden abgezogen, heißt bei height: 30px und border 1px und padding 2px ist die höhe innen: 24px und gesamt: 30px)

achtung: cm ist nicht gleich px :lol:

zum logo: bei mir(firebird 0.7) ist es mittig...

gruß, mic
Gespeichert

bryce
Newbie
*
Offline Offline

Beiträge: 45


Profil anzeigen
« Antworten #11 am: 02.02.2004 21:51 »

Hallo ..

so das wars jetzt fast. Echt toll, das es jetzt so schön funktioniert.

Einzig und alleine das Logo ist noch nicht mittig (zumindest bei Opera und IE).
Hast du noch ne Idee wie ich das bei den o.g. beiden Browsern vertikal
mittig hinbekommen kann?

Du hast recht bei Moz. gehts wie versprochen, bei den anderen wieder nicht.

Gruss und Danke nochmals
Peter
Gespeichert
mic
Newbie
*
Offline Offline

Beiträge: 25


Profil anzeigen WWW
« Antworten #12 am: 03.02.2004 13:53 »

hallo,
ach, ich hasse IE! (musste mal gesagt werden L&#228;chelnd ) Deswegen muss man immer extra Styles schreiben...

Das Logo mittig zu platzieren, sollte kein Problem sein: einfach zu dem Bild padding-top: XXpx addieren.
Also (wenn du keine Klasse für das Bild hast) zum img-Tag
Code:
style="padding-top: XXpx;"
hinzufügen.

Wahrscheinlich muss dann das vertical-align beim Container wieder weg, da ja sonst das Element in Firebird und Mozilla nach unten rutscht.

So, damit sollten dann alle CSS-Schwierigkeiten gelöst sein L&#228;chelnd

Gruß, mic
Gespeichert

Seiten: [1]   Nach oben
Drucken
Gehe zu: