Responsive Design werkt niet goed

Status
Niet open voor verdere reacties.

jorenman

Gebruiker
Lid geworden
27 jul 2013
Berichten
222
Hallo iedereen,

Ik ben bezig met het responsive design van een website (cashcontroller.nl) en ik werk dit uit via mijn computer.
Dit doe ik door middel mijn Google Chrome scherm kleiner te maken en zo het design te optimaliseren door Media Queries in CSS.

Maar nu heb ik een probleempje....
De header ziet er op een mobiel heel anders uit dan in een klein Google Chrome scherm...
Het lijkt wel alsof de header op een mobiel 50 pixels naar onderen staat...


Weet iemand hoe ik dit probleem kan verhelpen?
Zelf maak ik meerdere websites maar dit is mij nog nooit voorgekomen.



Groetjes,
Joren
 
Je geeft onvoldoende info voor een antwoord...
Zelf gebruik ik Twitter Bootstrap met breakpoints 768, 992 en 1200. Geen probleem hiermee.

Aanvulling:
Bootstrap gebruikt @media (min-width: ....px) { ... } , geen min-device-width.
 
Laatst bewerkt:
Welke info heb je dan nog meer nodig?

Daarnaast, zou je mij kunnen uitleggen wat Bootstrap doet?



Groetjes,
Joren
 
Welke info heb je dan nog meer nodig?
RE: zie de info al die ik zocht.

Daarnaast, zou je mij kunnen uitleggen wat Bootstrap doet?
RE: Responisve mobile first framework. http://getbootstrap.com/getting-started/
Dan hoef je zelf niet meer na te denken over al die @media's, dat is al gebeurd én wereldwijd getest.

Zou dit werken? Al die lange regels inkorten:
@media screen and (max-width: 780px) and (min-width: 481px), screen and (max-device-width: 780px) and (min-device-width: 481px) { ..... }
wijzigen in
@media (min-width: 481px) and (max-width: 780px) { ..... }
Dit ook bij de andere @media's
 
Nee, dit werkt helaas niet.

Weet je hoe ik dit alsnog kan verhelpen?
Waarschijnlijk ga ik in de toekomst Bootstrap gebruiken.


Groetjes,
Joren
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan