Logo Menu overlapping Firefox

Problem gelöst

Hi
da Enfold noch nicht flexibel mit dem Logo als solches arbeitet, hatte ich mir einen anderen Weg gesucht der funktioniert. Leider muss ich dazu ein wenig aussholen und es sei gesagt, dass es kein Standard ist…bin ich aber auch nicht :) Hinzu kommt, dass man darauf achten sollte, in welcher Auflösung des Bildschirmes man arbeitet und in welcher Auflösung man die Grafiken erstellt. Ich teste mit 2 Desktop Monitoren 1024×768 und 1680×1050, sowie mit zwei Tablets von Samsung und diversen Androids.
Voraussetzung ist die Auflösung 1024×768, denn wenn es da passt, passt es in der Regel überall.

Ich hatte mich dazu entschieden das Layout anders anzupacken, wegen dem Logo Problem und zudem wollte ich ein Logo über die gesamte Breite auf des Desktop PC´s. Wenn man nun bedenkt, dass das Logo von 1600 bis runter auf ca 750px skaliert werden soll (auch für mobile), bleibt letztendlich für ein großes Logo keine Option.
Lösung für Enfold: Drei Logogrößen selbst einbinden (Desktop/Tablet/Mobile) Der Vorteil wäre, dass das Logo immer schön scharf dargestellt wird und nicht zu klein ist. Auch sollten die Breakpoints in der Boxensnsicht individuell einstellbar sein und natürlich eine default Einstellung für Standard haben.

Nun arbeite ich mit einer zwei Varianten Ansicht.
Auf dem Deskotp PC´s wird als Logo ein angelegter LayerSlider verwendet und erst beim Scrollen kommt das Menu und dem Logo. Dazu in der Seite die Option “Header is invisible and appears…. auswählen und als erstes in der Seite den Slider einbetten.(Tolles großes animiertes Logo :)
Bei der Logodarstellung auf mobilen Geräten war es Testerei, da das Logo eigentlich eine Hintergrundfarbe besitzt. Dazu habe ich das Logo mit transparentem Hintergrund erstellt 482px × 156px …und dieses im Menu Enfold/Logo hochgeladen und anzeigen lassen in voller Größe. Den eigentlichen Hintergrund des Logos habe ich seperat erstellt und in den Einstellungen Enfold/Allgemeines Styling/Logo Area -> Benutzerdefiniertes Hintergrundbild hochgeladen 576px × 131px. Zusätzlich eingestellt Mittig/Mittig -> Horizontale Kachelung und Scrollen. Keine Sorge, die Bilder werden eh wieder skaliert.

Dazu fand ich noch einen Code für die mobile Menuansicht. Ich wollte nicht das rechts seitlich das Menu sichbar ist, da man dieses auch nicht zoomen kann. In der Custom CSS hatte ich folgendes eingefügt

#top #wrap_all  .av-social-link-mail:hover a {
background-color: #e52629;
color: #fff;
}
#mobile-advanced{
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
}

Im Grunde gibt Enfold einen super Support und bemüht sich sehr – Hut ab! Allerdings weiß ich nur zu gut, dass man leider keine EierlegendeWollmilchsau programmieren kann, da es zuviele “sich stets” wechselnde Parameter gibt.
LG

Hey set70,

do you have the same problem, when you switch to stretched layout?