variable Headerhöhe und Logogröße
- Jochen Ebert
- Autor
- Offline
- Premium Mitglied
Weniger
Mehr
- Beiträge: 106
- Dank erhalten: 4
1 Jahr 10 Monate her - 1 Jahr 10 Monate her #5295
von Jochen Ebert
variable Headerhöhe und Logogröße wurde erstellt von Jochen Ebert
Hallo,
ich suche mir gersade einen Wolf im Allrounder nach
- variabel Höhe für den Header in Abhängigkeit zum header-hintergrund (mobile Ansicht)
- variable Größe des Logobild bei der mobilen Ansicht
Die Schriftgröße konnte ich per clamp an die Bildschirmbreite anpassen
www.mfc-saturn.de
Das selbe würde ich nun noch versuchen bei der Headerhöhe und dem Logobild zu erreichen.
Ich finde ja noch nicht einmal, wo die Logogröße definiert ist.
Ich habe die Hoffnung, das ich ähnlich oder sogar mit clamp, das Logobild entsprechend für die mobil Ansicht kleiner bekomme.
Bei der Headerhöhe (die ist im Moment auf 180px fest), wird es bestimmt nicht so schwierig sein. Das Headerhintergrundbild wird durch die feste Höhe natürlich im Moment nicht in der Höhe skaliert. Da probiere ich noch.
Beim Logo allerdings stehe ich vor einem Rätsel.
Die Definition dafür finde ich einfach nicht.
Danke für einen Denkanstoss.
Danke
ich suche mir gersade einen Wolf im Allrounder nach
- variabel Höhe für den Header in Abhängigkeit zum header-hintergrund (mobile Ansicht)
- variable Größe des Logobild bei der mobilen Ansicht
Die Schriftgröße konnte ich per clamp an die Bildschirmbreite anpassen
www.mfc-saturn.de
Das selbe würde ich nun noch versuchen bei der Headerhöhe und dem Logobild zu erreichen.
Ich finde ja noch nicht einmal, wo die Logogröße definiert ist.
Ich habe die Hoffnung, das ich ähnlich oder sogar mit clamp, das Logobild entsprechend für die mobil Ansicht kleiner bekomme.
Bei der Headerhöhe (die ist im Moment auf 180px fest), wird es bestimmt nicht so schwierig sein. Das Headerhintergrundbild wird durch die feste Höhe natürlich im Moment nicht in der Höhe skaliert. Da probiere ich noch.
Beim Logo allerdings stehe ich vor einem Rätsel.
Die Definition dafür finde ich einfach nicht.
Danke für einen Denkanstoss.
Danke
Letzte Änderung: 1 Jahr 10 Monate her von Jochen Ebert.
Bitte Anmelden oder Registrieren um der Konversation beizutreten.
- Thomas Hunziker
- Offline
- Administrator
1 Jahr 10 Monate her #5296
von Thomas Hunziker
Thomas Hunziker antwortete auf variable Headerhöhe und Logogröße
Fürs Logo gibt es ne eigene ID die du in deiner CSS Regel als Ziel definieren kannst.
ist das umgebende "DIV". Das Bild selber dann mittels
Damit solltest eigentlich recht viel machen können.
Code:
#logo
Code:
#logo img
Folgende Benutzer bedankten sich: Jochen Ebert
Bitte Anmelden oder Registrieren um der Konversation beizutreten.
- Jochen Ebert
- Autor
- Offline
- Premium Mitglied
Weniger
Mehr
- Beiträge: 106
- Dank erhalten: 4
1 Jahr 10 Monate her #5297
von Jochen Ebert
Jochen Ebert antwortete auf variable Headerhöhe und Logogröße
Habe es nun schon ein wenig hinbekommen.
Mit den Werten muss ich noch ein wenig spielen, damit alles ein wenig flüssiger aussieht. Aber vom Grundsatz her klappt es schon mal.
Am Handy sieht es nun schon viel besser aus.
Code:
/* Schriftgröße HEADER "logo" und "slogan" automatisch anpassen */
#logo a.logo {
font-size: clamp(12px, 6vw, 46px);
}
div.slogan {
font-size: clamp(14px, 3vw, 18px);
}
/* Headerhöhe automatisch anpassen*/
#header {
min-height: clamp(80px, 30vw, 180px);
}
/* Headerlogo nach rechts */
#logo {
margin-left: 10px;
}
/* Logo Größe automatisch anpassen */
#logo img, svg {
width: clamp(70px, 17vw, 130px);
}
a.imglogo, a.medialogo{
width: clamp(75px, 20vw, 140px);
}
Am Handy sieht es nun schon viel besser aus.
Bitte Anmelden oder Registrieren um der Konversation beizutreten.
- Thore knels
- Offline
- Neues Mitglied
Weniger
Mehr
- Beiträge: 19
- Dank erhalten: 0
1 Jahr 8 Monate her #5334
von Thore knels
Thore knels antwortete auf variable Headerhöhe und Logogröße
Hallo,
wie bekomme ich dann das Hamburgermenü in Topmenü hin. Ich hätte es gerne genau wie bei dir. Nebeneinander in der großen Ansicht und auf dem Handy als Hamburgermenü.
Ich habe dazu bislang nichts gefunden. Vermutlich nur der falsche Suchbegriff.
Viele Grüße Thore
wie bekomme ich dann das Hamburgermenü in Topmenü hin. Ich hätte es gerne genau wie bei dir. Nebeneinander in der großen Ansicht und auf dem Handy als Hamburgermenü.
Ich habe dazu bislang nichts gefunden. Vermutlich nur der falsche Suchbegriff.
Viele Grüße Thore
Bitte Anmelden oder Registrieren um der Konversation beizutreten.
- Thomas Hunziker
- Offline
- Administrator
1 Jahr 8 Monate her #5335
von Thomas Hunziker
Thomas Hunziker antwortete auf variable Headerhöhe und Logogröße
Guck mal in die Moduleinstellungen des Menüs. Da kannst beim Layout (im Reiter "Erweitert") das einklappbare Layout wählen. Dann kommt der Hamburger.
Folgende Benutzer bedankten sich: Michael Schwartz
Bitte Anmelden oder Registrieren um der Konversation beizutreten.
Ladezeit der Seite: 0.100 Sekunden