welke css query method gebruiken is het beste?element query,container query of media query?

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Johannes davidian

johannes davidian

20/04/2017 16:52:50
Quote Anchor link
Hallo,
ik wil weten welke css query method gebruiken is het beste:
element query ,container query(opvolger van element query) welke is gericht op element,of media query? en waarom?
zou het media query voldoende zijn voor moderne responsive website of container query heeft meer voordelen?
dank u wel
johannes
Gewijzigd op 21/04/2017 12:20:51 door Johannes davidian
 
PHP hulp

PHP hulp

24/11/2024 17:15:37
 
Frank Conijn

Frank Conijn

08/06/2017 22:33:06
Quote Anchor link
Ik heb eerlijk gezegd geen flauw idee waar je het over hebt. CSS media queries? Meta tag queries? En wat zijn element en container queries überhaupt? Of heb je het wellicht over document.querySelector/document.querySelectorAll in javascript?
 
Jan Graneker

Jan Graneker

09/06/2017 08:21:27
Quote Anchor link
Frameworks zoals Bootstrap zijn in de basis gebaseerd op containers/grids. Deze containers worden responsive gemaakt. Vervolgens kijk je of de content goed meeschaalt, zoniet dan kun je ook een aparte regel in de Media queries maken.

Voor zover ik weet gebruik je hier altijd Media queries voor.

Wat wel helpt om zo min mogelijk media queries regels te krijgen is om de content al flexibel te maken. Hiervoor kun je de Flex-box gebruiken.

Meer informatie hierover:
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
Gewijzigd op 09/06/2017 08:30:49 door Jan Graneker
 
Johannes davidian

johannes davidian

09/06/2017 12:11:40
Quote Anchor link
dank u wel,
Ik ben begonnen om bootstrap te gebruiken in plaats van foundation grid systeem.
maar mij vraag is:
ik denk flex-box wordt niet ondersteunt bij iedere browser.
als dat is zo? wat kan oplossingen zijn voor deze browsers?
johannes
 
- Ariën  -
Beheerder

- Ariën -

09/06/2017 12:14:48
Quote Anchor link
De Flexbox wordt niet door elke browser ondersteund:
http://caniuse.com/#search=flexbox

Verder is Caniuse een zeer handige site om compatibiliteit op te zoeken.
 
Johannes davidian

johannes davidian

09/06/2017 16:56:27
Quote Anchor link
dank u wel
johannes
 
Willem vp

Willem vp

11/06/2017 18:59:44
Quote Anchor link
- Ariën - op 09/06/2017 12:14:48:
De Flexbox wordt niet door elke browser ondersteund:
http://caniuse.com/#search=flexbox

Huh? "Niet"? Ik zie alleen maar groene blokjes...
 
- Ariën  -
Beheerder

- Ariën -

11/06/2017 19:21:25
Quote Anchor link
Hm, ik zou zweren dat ik er ergens een rode tussen zag? In ieder geval is het een heel groot aandeel inmiddels.
 
Ozzie PHP

Ozzie PHP

11/06/2017 20:33:13
Quote Anchor link
>> Huh? "Niet"? Ik zie alleen maar groene blokjes...

Moet je even op "Show all" klikken.

Zoals je dan ziet, hebben met name oudere IE versies geen goede ondersteuning.
 
- Ariën  -
Beheerder

- Ariën -

11/06/2017 21:50:37
Quote Anchor link
Wie gebruikt er nog IE9 :-P?
Die 0,2 procent is wel erg weinig....

De rest van de browsers hebben wel een automatische update.
Gewijzigd op 11/06/2017 21:51:43 door - Ariën -
 
Willem vp

Willem vp

12/06/2017 00:18:05
Quote Anchor link
Ozzie PHP op 11/06/2017 20:33:13:
>> Huh? "Niet"? Ik zie alleen maar groene blokjes...

Moet je even op "Show all" klikken.

Zoals je dan ziet, hebben met name oudere IE versies geen goede ondersteuning.

Als je gaat kijken welke browsers geen of een slechte ondersteuning hebben, dan blijken dat browsers te zijn die al een jaar of vijf oud zijn. Je moet je afvragen of je dergelijke browsers uberhaupt nog wilt ondersteunen. De problemen die je dan over je afroept zijn groter dan die van dat ene flexboxje.

Mijn credo in dezen is: laat de natuurlijke selectie zijn werk doen. ;-)
 
Ozzie PHP

Ozzie PHP

12/06/2017 02:18:41
Quote Anchor link
I couldn't agree more :-)
 
Ward van der Put
Moderator

Ward van der Put

12/06/2017 07:11:03
Quote Anchor link
Er zijn zelfs mensen die met een 8 jaar oud besturingssysteem blijven werken…
 
Ozzie PHP

Ozzie PHP

12/06/2017 17:01:44
Quote Anchor link
En wat heeft dat met een up-to-date browser te maken?
 
- Ariën  -
Beheerder

- Ariën -

12/06/2017 17:42:04
Quote Anchor link
Edge wordt pas geleverd sinds Windows 10, en de ontwikkeling voor Internet Explorer is gestopt.
 
Johannes davidian

johannes davidian

12/06/2017 18:02:03
Quote Anchor link
ik zie dat bij IE 11 staat (Partial support is due to large amount of bugs present (see known issues) )
hoe kan dan deze problemen opgelost?
johannes
 
- Ariën  -
Beheerder

- Ariën -

12/06/2017 18:21:39
Quote Anchor link
Wat bedoel je? Je wilt weten hoe je de problemen oplost?
Al doorgeklikt naar het naastgelegen tabblad?
 
Johannes davidian

johannes davidian

12/06/2017 18:35:34
Quote Anchor link
na show all,
ik zie op nummer 4 ((Partial support is due to large amount of bugs present (see known issues) )
geen doorgeklikt functie.
johannes
 
- Ariën  -
Beheerder

- Ariën -

12/06/2017 18:51:09
Quote Anchor link
'Known issue' tabblad ernaast.
 
Johannes davidian

johannes davidian

12/06/2017 19:13:24
Quote Anchor link
sorry,
ik heb niet opgelet.
dank U Wel
johannes
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.