Startseite
  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche
Startseite › Forum › Drupalcenter.de › Module ›

Aufklappbare Menüs, Ansicht Firefox & IE

Eingetragen von FuXXz (173)
am 14.11.2008 - 18:19 Uhr in
  • Module
  • Drupal 5.x oder neuer

Hallo zusammen,

ich bin mir jetzt nicht ganz sicher ob es eigentlich ne reine CSS Frage ist oder ob es doch etwas mit dem Drupal Core zu tun hat. Ich habe derzeit ein Darstellungsproblem mit den standard Menüs (aufklappbar) von Drupal, was die Ansicht im IE betrifft.

Hier die erste, richtige Variante aus dem Firefox ! Man sieht, dass die einzelnen div´s einen korrekten Hintergrund haben und dass die zusammengeklappten Menüs mit einer durchgezogenen Linie dargestellt werden

Hier die IE Variante. Der Hintergrund läuft aus dem div nach oben raus und die Linien der zusammengeklappten Menüs sind verschwunden.

Der CSS Code ist recht unspektakulär und ich kann da keinen Fehler finden:

fieldset.collapsible{
background-color: #7B8A94;
border: #000 solid 1px;
}

fieldset.collapsed{
background: none;

}
legend a{
color: #fff;
font-weight: bold;
text-decoration: none;
}

Kann mir da jemand behilflich sein?

Viele Grüße Fuxxz

‹ Bookmarks 6.x-1.4-4 FCK-Editor wird beim Page-erstellen nicht angezeigt ›
  • Anmelden oder Registrieren um Kommentare zu schreiben

Conditional Tags -> ie.css

Eingetragen von quiptime (4972)
am 15.11.2008 - 03:11 Uhr

Linke ueber Conditional Tags auf eine eine CSS Datei fuer den IE und erstelle fuer den IE entsprechende Formatierungen.

PS
In den meisten Themes ist bereits auf eine ie.css per Conditional Tag gelinkt.

-------------
quiptime

Nur tote Fische schwimmen mit dem Strom.

XING

Da geht noch was.

  • Anmelden oder Registrieren um Kommentare zu schreiben

Danke für deine Antwort,

Eingetragen von FuXXz (173)
am 15.11.2008 - 03:32 Uhr

Danke für deine Antwort, ich benutze das zen theme und ich glaube da ist so ein verweis schon integriert, aber ich weiß es nicht genau!

Wie binde ich denn dann diese "Conditional Tags" ein?

Ìch weiß zudem leider nicht welche alternativen Formatierungen ich vornehmen muss um dieses Problem zu beseitigen ! :(

  • Anmelden oder Registrieren um Kommentare zu schreiben

CSS lernen

Eingetragen von quiptime (4972)
am 15.11.2008 - 12:27 Uhr
Zitat:

Wie binde ich denn dann diese "Conditional Tags" ein?

Diese Tags sind die Conditionaltags

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
 
  <!-- Additional IE/Win specific style sheet (Conditional Comments) -->
  <!--[if IE]>
  <style type="text/css" media="all">@import "/sites/all/modules/jstools/tabs/ie.css";</style>
  <![endif]-->
 
 
<link rel="alternate" type="application/rss+xml" title="DBox RSS" href="http://dbox.quiptime.com/rss.xml" />

Der Tag: <!--[if IE]> <![endif]-->

Du musst die fuer den IE bestimmten CSS Formatierungen einfach in der Datei "ie.css" eintragen.

Zitat:

Ìch weiß zudem leider nicht welche alternativen Formatierungen ich vornehmen muss um dieses Problem zu beseitigen

Da wirst Du Dich in das Thema HTML mittels CSS formatieren einarbeiten muessen.

Guter Ansatzpunkt ist www.css4you.de

PS
Google bietet ausreichend Infos zum Einlesen in das Thema Conditional Tags.

-------------
quiptime

Nur tote Fische schwimmen mit dem Strom.

XING

Da geht noch was.

  • Anmelden oder Registrieren um Kommentare zu schreiben

Aufklappbare Menüs, Ansicht Firefox & IE - Lösung

Eingetragen von quiptime (4972)
am 15.11.2008 - 13:17 Uhr

Sehe Dir mit dem Firebug mal den Bereich des Fieldset an.

Dann wirst Du erkennen das sich der IE mit der Hintergrundfarbe korrekt verhält und der Firefox logisch.

Lösung

Da sich im Fieldset ein Div "fieldset-wrapper" befindet das den gesamten Fieldset-Inhalt hält könnte man dieses Div an Stelle des Fieldset mit Hintergrundfarbe versehen.

Bei diesem Div "fieldset-wrapper" endet aber die Oberkante bereits unterhalb des Fieldset-Label und ist deswegen nicht in Übereinstimmung mit der Oberkante des Fieldset.
Um dies zu lösen könnte man das Div "fieldset-wrapper" mit margin in Kombi mit padding korrigierend positionieren. Etwa so:

.fieldset-wrapper {
  margin-top:-10px;
  padding-top:10px;
  background-color: #7B8A94;
}

PS
Vermutlich kann man mit dieser Loesung auf eine extra CSS Formatierung für den IE verzichten.

-------------
quiptime

Nur tote Fische schwimmen mit dem Strom.

XING

Da geht noch was.

  • Anmelden oder Registrieren um Kommentare zu schreiben

Hallo quiptime, danke für

Eingetragen von FuXXz (173)
am 15.11.2008 - 16:43 Uhr

Hallo quiptime, danke für deine Antworten,

ich habe jetzt versucht das Ganze umzusetzen, die Ansätze scheinen richtig zu sein aber die praxis sieht wieder anders aus :(

Zum Thema Conditionaltags, so benutze ich das Zen-Theme und da habe ich in der page.tpl diesen IF Verweis auf die ie.css gefunden. Auch wenn dort jeder Befehl mit einem Unterstrich deaktiviert ist.

Zu dem Thema mit dem fieldset, so bin ich deinen Anweisungen gefolgt, das Ergebnis ist folgendes :(

Firefox:
Sobald ich die Paddings einsetze, erscheint im zugeklappten Zustand ein grauer Balken (scheint wohl der fieldset-wrapper in miniatur zu sein ;), der verschwindet sobald man die Menüs einmal aufgeklappt und wieder geschlossen hat...mhhh
Außerdem interpretiert entweder der Firefox oder der IE das margin top falsch, wie man sieht, fehlen hier ca. 5px (muss man das dann mit der ie.css lösen ? In allen anderen Bereichen passen die margins ja auch für beide Browser, daher ist das irgendwie komisch)

IE7
Dort gibt es wohl nur noch ein Ebenen Problem, der Wrapper legt sich jetzt wohl übers fieldset und verdeckt so den Inhalt

fieldset{

border: #000 solid 1px;
}
fieldset.collapsible .fieldset-wrapper{
background: #7B8A94;
margin: -7px -6px -6px -6px;
padding: 7px 7px 7px 7px;

}

fieldset.collapsible{
position: relative;

}
fieldset.collapsed{
background: none;


}

  • Anmelden oder Registrieren um Kommentare zu schreiben

In dieser Situation ist man in Teufels CSS Kueche angekommen.

Eingetragen von quiptime (4972)
am 15.11.2008 - 18:23 Uhr

In meinem FF sehe ich das was Du im IE siehst. Das Feldset-Label wird vom Feldset-Hintergrund "verdeckt". Nun kann man dem Feldset-Label <legend class="collapse-processed"> noch einen Hintergrund geben.

Um es aber optisch ansprechend zu loesen muss man wohl das Feldset-Label <legend class="collapse-processed"> so weit nach oben nehmen das es nicht (nach unten) in das Feldset hineinragt. Damit gibt es keine Ueberschneidungen mehr. In dem Zusammenhang muesste man auch das kleine Dreieck des Label in seiner Position korrigieren - was aber ein nicht loesbares Problem ist das es ebenfalls vom Hintergrung des <div class="fieldset-wrapper"> verdeckt wird.

In dieser Situation ist man in Teufels CSS Kueche angekommen.

Ich denke es ist am einfachsten auf das margin und padding bei fieldset.collapsible .fieldset-wrapper zu verzichten. Dadurch umgeht man alle Schwulitaeten mit dem Feldset-Label und dem kleinen BG-Image-Dreieck.

-------------
quiptime

Nur tote Fische schwimmen mit dem Strom.

XING

Da geht noch was.

  • Anmelden oder Registrieren um Kommentare zu schreiben

FuXXz schrieb Zum Thema

Eingetragen von md (3717)
am 15.11.2008 - 18:50 Uhr
FuXXz schrieb

Zum Thema Conditionaltags, so benutze ich das Zen-Theme und da habe ich in der page.tpl diesen IF Verweis auf die ie.css gefunden. Auch wenn dort jeder Befehl mit einem Unterstrich deaktiviert ist.

Der Unterstrich ist ein Hack für IE 5/6. Im Gegensatz zu den anderen Browsern interpretieren diese Attribute mit einem _ und so kann man damit spezielle Anweisungen für den IE 5/6 schreiben. Der IE 7 nimmt die 'normalen' Anweisungen aus der ie.css

vg
--
md - DrupalCenter

mdwp* :: Drupal Services

vg
md - DrupalCenter.de

mdwp* Drupal Consulting & Services

  • Anmelden oder Registrieren um Kommentare zu schreiben

puhh jetzt weiß ich gar nix

Eingetragen von FuXXz (173)
am 15.11.2008 - 19:24 Uhr

puhh jetzt weiß ich gar nix mehr! du siehst im FF das was ich im IE sehe? Wie ist das denn möglich ? Ich nutze FF 3.0.4...glaube aber nicht daß dies eine große Rolle spielt

Zum Kernproblem, irgendwie muss mann das doch lösen können, es kann ja nicht sein daß es auf der ganzen Welt keine Internetseite gibt mit Hintergrund im div :D
Im Drupal Admin Bereich sind ja alle Menüs nach dem Prinzip aufgebaut und da geht es ja auch, zumindest mit einer Verlaufsgrafik im oberen Bereich (Garland Theme).

  • Anmelden oder Registrieren um Kommentare zu schreiben

Lösung

Eingetragen von FuXXz (173)
am 16.11.2008 - 17:56 Uhr

Ich weiß nicht ob es euch Interessiert, weil es ja euch alle betrifft :)
Jeder von euch hat ja diesesn unschönen Effekt im IE7 :(

Ich habe jetzt einfach folgendes getan:

  1. Eine neue Grafik erstellt z.B. 1000px (einfach grösser als die maximal Höhe des divs) x 50px
  2. Diese Grafik dann mit der Hintergrundfarbe eingefärbtdie der DIV haben soll
  3. Dann die Grafik oben um die Höhe des übergelaufenen Bereichs im IE mit der Seitenhingerdunfarbe gefärbt
  4. Grafik einfach via Background: url... eingebunden und glücklich sein :)

Und trotzdem nochmal vielen Danke für eure Mühe

Gruß Fuxxz

  • Anmelden oder Registrieren um Kommentare zu schreiben

Benutzeranmeldung

  • Registrieren
  • Neues Passwort anfordern

Aktive Forenthemen

  • PHP 8.1 - Deprecated function: rtrim()
  • Preloader / Spnner entfernen Menu Link Modal-Modul
  • Schriftgröße standard einstellen
  • Drupal Website gestalten
  • MariaDB 10.6
  • Entity Reference - Title Felder werden als Link angezeigt
  • Tokens werden in Viev als Link angezeigt
  • [bug entdeckt & workaround gefunden] benutzerdefinierte Felder vom Userprofil tauchen ungefragt auch in den Forumtopics auf...
  • [gelöst] Mass contact Empfängerliste nach Taxonomy Term statt Rolle
  • Update V. 9.3.12 auf V. 9.4 mit Fehler: Modul mySQL fehlt. Bitte Hilfe.
  • Sprachpfad, in Drupal Korrekt einstellen, auch bei den Meta-Tags
  • Update von Drupal 9.3 auf 9.4 oder bei 9.3 bleiben
Weiter

Neue Kommentare

  • Danke fürs Feedback. Gut dass
    vor 2 Tagen 16 Stunden
  • Patch angewandt
    vor 2 Tagen 19 Stunden
  • core_version_requirement: ^8
    vor 4 Tagen 20 Stunden
  • core_version_requirement: ^8
    vor 4 Tagen 20 Stunden
  • ok. Wenn ich das mache
    vor 4 Tagen 20 Stunden
  • Bei gleichem Namen hat das
    vor 4 Tagen 21 Stunden
  • Sorry, dass ich mich hier
    vor 4 Tagen 21 Stunden
  • Habe Patch versucht
    vor 5 Tagen 4 Stunden
  • Hier wird ein Patsch
    vor 5 Tagen 6 Stunden
  • Mit Drupal geht das um 150
    vor 5 Tagen 17 Stunden

Statistik

Beiträge im Forum: 247866
Registrierte User: 19592

Neue User:

  • Davidsnins
  • kudes
  • Tkakah

» Alle User anzeigen

User nach Punkten sortiert:
wla9213
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3924
ronald3845
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 0 User und 4 Gäste online.

Hauptmenü

  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche

Quicklinks I

  • Infos
  • Drupal Showcase
  • Installation
  • Update
  • Forum
  • Team
  • Verhaltensregeln

Quicklinks II

  • Drupal Jobs
  • FAQ
  • Drupal-Kochbuch
  • Best Practice - Drupal Sites - Guidelines
  • Drupal How To's

Quicklinks III

  • Tipps & Tricks
  • Drupal Theme System
  • Theme Handbuch
  • Leitfaden zur Entwicklung von Modulen

RSS & Twitter

  • Drupal Planet deutsch
  • RSS Feed News
  • RSS Feed Planet
  • Twitter Drupalcenter
Drupalcenter Team | Impressum & Datenschutz | Kontakt
Angetrieben von Drupal | Drupal is a registered trademark of Dries Buytaert.
Drupal Initiative - Drupal Association