1485 sujets

Web Mobile et responsive web design

Pages :
Bonjours, alors voilà mon problème je galère totalement a avoir une bonne résolution pour l iPhone ... Mon site sur ordi est génial est sur mon iPhone c est une galère ... J vous laisse jeter un œil et peut être trouver mon souci un grand merci !!

www.usgirlsc.ch Smiley biggrin
Bonjour et bienvenue,

Je vais être franc avec vous. Non votre site n'est pas "génial sur ordi" pour les raisons suivantes (qui j'espère vous aideront):

- sur Safari le contenu est complètement rétréci et bloqué à droite.
- des erreurs au validateur
- le logo (écusson) qui prend toute la page au rétrécissement de la page (enlever le width:auto à moins que cela soit voulu)
- des blocs avec des width en pixel sans points de rupture.

et puis la musique qui se lance au démarrage c'est épidermique pour beaucoup d'internaute (mais cet avis ne rentre pas dans le sujet)

Bon courage Smiley smile
Footeuse5 a écrit :
Oui justement avec safari c'est une catastrophe essayé avec firefox vous verrez que sa change

Non, pas vraiment Smiley cligne
des blocs avec des width en pixel sans points de rupture ??

Où est-ce que je les changes ?

Dans: @media (max-width: 640px){
@media (max-device-width:768px) and (orientation: landscape) {
@media screen and (min-width: 320px) and (max-width: 480px) {
@media screen and (orientation:portrait) {
@media screen and (orientation:landscape) {
ou @media screen and (min-device-width: 320px) ????


Merci de ta réponse
Je ne vais pas regarder votre code en détail car déjà pour vous répondre au premier post j'ai mis un peu de temps pour d'une part comprendre et ensuite répondre.

Je peux toutefois vous conseiller comme base de départ de cibler pas à pas les supports.
Exemple:

@media (max-width: 640px) 
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) 
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)


C'est un exemple dans lequel j'ai ciblé Iphone et Ipad sur lesquels je peux tester les rendus.
GRAND MERCIIIII !!!

Grâce à toi j'ai fait un grand pas en avant.


PS: tu connais le site developpez.com ? Tu pourrais aller leur donner des cours Smiley cligne et tu aiderais pas mal de monde !!
Heu j'aurais une question par rapport à l'Iphone.

Tout fonctionne à part une chose: les sous-menus de mon menu principal.

Je n'arrive pas à cliquer sur le menu (où il y a un sous-menu) pour justement afficher le sous-menu. Lorsque je passe la souris sur le texte, le sous menu ne s'affiche pas.
C'est le problème des menus avec sous-menus en responsive.

Une solution parmi d'autres est de s'orienter vers une solution comme celle-ci (il faut rétrécir la fenêtre jusqu'à apparition du nouveau menu)
Ce qui est étrange c'est que lorsque je suis sur la page d'accueil, il y a seulement le sous-menu qui s'affiche.
Après lorsque je vais sur les autres pages, aucun sous menu est cliquable.
Je teste sur Iphone et le sous-menu ne s'affiche pas chez moi.

C'est normal que le sous-menu ne s'affiche en responsive puisqu'il réagit au survol, comportement qui n'existe pas sur mobile.
Pages :