Joomla!NL - [opgelost] Mediaqueries - header.

Mediaqueries - header.

13 okt 2018 20:04 - 13 okt 2018 21:24

#1

Deze afbeelding is verborgen voor gasten.
Login of registreer om deze te zien.

Goedenavond,

Ik experimenteer al enige tijd met de header op mijn webiste, deze schaalde niet mee bij het verkleinen voor bv mobiele devices.
Dit is nu inmiddels gelukt door de background-size: op 100%; te zetten alleen nu krijg ik bij het verkleinen een groot grijs vlak onder mijn header
en ik heb geen idee hoe ik deze er tussenuit krijg.

De header schaalt nu wel mee maar er blijft een grijs vlak tussen de header en hetgeen daaronder zit zitten, iemand enig idee wat ik fout doe?
Ik zou graag willen dat de header vast blijft zitten aan hetgene daaronder.

De link is www.rogueviking.studio

Groeten Brenda

Frossi
Heeft onderwerp gestart
Nieuw op Joomla!NL
Berichten: 4

Mediaqueries - header.

13 okt 2018 20:29

#2

Hallo Brenda,
Namens het Joomla!NL team heet ik je hartelijk welkom op dit forum.

Dat komt door deze regels in je template.css:

Code:

header { 
height: 350px;

Die zul je dus ook nog moeten opnemen in je mediaqueries.

Groeten, Romke

Voordat je een vraag post, gebruik eerst de zoekfunctie van ons forum eens.
Vragen uitsluitend via dit Forum

Is je vraag opgelost? Dan kan je hem zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Romke
Algemeen Moderator
Berichten: 3647

Mediaqueries - header.

13 okt 2018 21:03 - 13 okt 2018 21:22

#3

Hoi Romke,

Bedankt voor je snelle antwoord!

Bedoel je zoiets als het toevoegen van:

Code:

@media screen and (min-width: 600px) {
header {
height:350px;
background-image:url(../images/header-bg.jpg);

Aan het template.css bestand

Ik heb namelijk al een aantal dingen uitgeprobeerd maar er lijkt niets te veranderen.

Broeten Brenda

Edit Astrid: Ik heb de code tussen codetags geplaatst, volgende keer graag zelf doen.

Frossi
Heeft onderwerp gestart
Nieuw op Joomla!NL
Berichten: 4

Mediaqueries - header.

13 okt 2018 21:14

#4

Wat ik hiermee wil aangeven dat jij je header een vaste hoogte meegeeft.
Op mobiel wordt je afbeelding (terecht) kleiner. Echter de hoogte van de header blijft wel 350px. Immers dat staat hard in je template.css.
Je zult dus bij je mediaqueries moeten aangeven dat bij een kleiner schermbreede de header ook kleiner wordt. Zal even experimenteren worden welke waarde(n) je moet meegeven bij de verschillende kleinere schermen.

Groeten, Romke

Voordat je een vraag post, gebruik eerst de zoekfunctie van ons forum eens.
Vragen uitsluitend via dit Forum

Is je vraag opgelost? Dan kan je hem zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Romke
Algemeen Moderator
Berichten: 3647

Mediaqueries - header.

13 okt 2018 21:45

#5

Ahh, okay ik ga verder speuren, bedankt!

Groeten Brenda

Frossi
Heeft onderwerp gestart
Nieuw op Joomla!NL
Berichten: 4

Mediaqueries - header.

13 okt 2018 21:56 - 13 okt 2018 21:56

#6

Eerder zoiets:

Code:

@media screen and (max-width: 600px) {
header {
height:50px;
}

Ik weet niet waar je die template vandaan hebt, maar ik vermoed dat je daarmee nog wel tegen meer problemen aan zult lopen. Dus misschien handiger om op zoek te gaan naar een goede responsive template?

Groetjes, Astrid

Gebruik de zoekfunctie van dit forum voordat je een nieuwe vraag plaatst.
Vragen uitsluitend via dit forum.
yndi.nl - kvk 17157725

Is je vraag beantwoord? Dan kan je het draadje zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Astrid
Moderator + Technisch team
Berichten: 37556

Mediaqueries - header.

14 okt 2018 00:01

#7

Hoi Astrid,

Gekocht bij netspecialist, echter als ik inderdaad andere codes bekijk toch iets minder specialist dan ik dacht..

Maar goed nieuws dankzij jouw tip is het gelukt wat ik wilde, nu kan ik verder sleutelen, dank jullie wel!

Groeten Brenda

Frossi
Heeft onderwerp gestart
Nieuw op Joomla!NL
Berichten: 4

Mediaqueries - header.

14 okt 2018 08:06

#8

Fijn dat het opgelost is.
Dank je wel voor de terugkoppeling.

Je kunt in de toekomst zelf na het terugkoppelen de topic sluiten door op de groene "Oplossing" knop te klikken.
Kijk ook hier even voor een volgende keer

Groeten, Romke

Voordat je een vraag post, gebruik eerst de zoekfunctie van ons forum eens.
Vragen uitsluitend via dit Forum

Is je vraag opgelost? Dan kan je hem zelf sluiten .
Wil je Joomla!NL steunen? Dat kan met een donatie.

Romke
Algemeen Moderator
Berichten: 3647

Laatste nieuws

Welkom bij Joomla!NL

opgelost Mediaqueries - header.

Mediaqueries - header.

Mediaqueries - header.

Mediaqueries - header.

Mediaqueries - header.

Mediaqueries - header.

Mediaqueries - header.

Mediaqueries - header.

Mediaqueries - header.

Laatste forumberichten

Wil je Joomla!NL steunen?