Discussion :

[ickyknox]

Site compatible phone
ickyknox - 11 avril 2013 à 10:50
Ne plus suivre - Modifier
bonjour à tous

je créé un site pour les versions tablettes et phone. Je suis amateur.

Mais quand j'en arrive aux tablettes:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
  /* TABLETTE */
 
@media (max-width: 768px){
 
#logo {
	visibility:hidden;
}
#menu ul {margin:0 0 0 0px;
	}
 
#logo-phone {
background-color: rgba(37, 20, 13, 0.5);
	height:52px;	padding-top:20px;
 
	}
 
 
#logo-phone a{
	visibility:visible;
	}
 
 
article, aside {
	width:90%;
	padding:20px;
    display: block;
    vertical-align: top;
    text-align: justify;}
			}

La mesure est bonne sur mon site :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

http://icreatorbeta.free.fr/

mais si je décide de rétrécir manuellement la fenêtre dans le sens horizontal,
en dessous de 768px, la fenetre va cacher la partie droite de mon site, m'obligeant ainsi à scroller horizontalement.

Or ce que je veux, c'est que mon contenu s'écrase en fonction de la largeur de la fenetre.

Comment puis je faire s'il vous plait ?

Je vous remercie !

[rodolphebrd]

C'est le problème des largeur en pixel en responsive:
Avec un max-width vous remplissez votre objectif.

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
section {
padding-top: 80px;
max-width: 730px;
margin: auto;
}

[ickyknox]

rodolphe, merci beaucoup,

non seulement ca fonctionne, mais ca m'a débloqué beaucoup d'autres problèmes.

MERCI encore !