Design fixe et extensible
timo
-
timo -
timo -
Bonjour,
je suis actuellement entrain de créer un site web, qui n'est pas encore en ligne car j'ai un petit problème au niveau de mon design sur la page d'accueil. L'idéal est de faire un design qui serait extensible mais qu'a partir d'une certaine résolution le site reste fixe; pour ce qui ne voient pas, se serait comme la page d'accueil de Facebook : quand on réduit la fenêtre du navigateur horizontalement, le site se rétréci sur ses bord et puis au bout d'un moment reste fixe. Moi je n'arrive qu'a faire soit un site complètement fixe soit complément extensible...
Aidez moi s'il vous plait !
je suis actuellement entrain de créer un site web, qui n'est pas encore en ligne car j'ai un petit problème au niveau de mon design sur la page d'accueil. L'idéal est de faire un design qui serait extensible mais qu'a partir d'une certaine résolution le site reste fixe; pour ce qui ne voient pas, se serait comme la page d'accueil de Facebook : quand on réduit la fenêtre du navigateur horizontalement, le site se rétréci sur ses bord et puis au bout d'un moment reste fixe. Moi je n'arrive qu'a faire soit un site complètement fixe soit complément extensible...
Aidez moi s'il vous plait !
A voir également:
- Design fixe et extensible
- Changer pile bios pc fixe - Guide
- Comment connecter un ordinateur fixe en wifi sans fil - Guide
- Mac fixe - Guide
- #31# appel masqué fixe - Guide
- Freeplug rouge fixe ✓ - Forum Réseau
12 réponses
Bonjour,
Pour faire celà, rien de plus simple:
Il te faut un <div> juste après le body avec un width de 980px (comme FB), tu le centre avec un margin: 0 auto 0 auto;
Ca va se faire tout seul ensuite. Un petit conseil, pense à faire un "RESET CSS" pour que tout soit propre et que rien ne déborde.
Pour faire celà, rien de plus simple:
Il te faut un <div> juste après le body avec un width de 980px (comme FB), tu le centre avec un margin: 0 auto 0 auto;
Ca va se faire tout seul ensuite. Un petit conseil, pense à faire un "RESET CSS" pour que tout soit propre et que rien ne déborde.
Oui j'ai deja essayer avec "min-width", mais mon site bouge un peut et la dispositon ne reste pas identique comme celle de Facebook. =S
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Merci a tous j'ai bien réussi avec pas mal de code a changer et des min-width a mettre un peut partout car j'ai une page d'accueil assez charger =P
Mais j'ai un dernier petit détaille qui me chagrine et a ce que je vois je ne suis pas le seul : quand je réduit horizontalement ma fenêtre de navigateur l'effet obtenue est celui que je rechercher, mais mon fond d'écran se coupe et laisse un fond blanc sur le coter droit, et je m'aperçois que cela fait pareille a Facebook, je voulais donc savoir si on pouvait remédier a sa, même si je pense que si il exciter une solution Le grand réseaux social l'aurait adopté...?
Mais j'ai un dernier petit détaille qui me chagrine et a ce que je vois je ne suis pas le seul : quand je réduit horizontalement ma fenêtre de navigateur l'effet obtenue est celui que je rechercher, mais mon fond d'écran se coupe et laisse un fond blanc sur le coter droit, et je m'aperçois que cela fait pareille a Facebook, je voulais donc savoir si on pouvait remédier a sa, même si je pense que si il exciter une solution Le grand réseaux social l'aurait adopté...?
Parle-t-on du même Facebook ?
Je n'ai aucune image d'arrière-plan sur ce site.
« L'idéal est de faire un design qui serait extensible mais qu'a partir d'une certaine résolution le site reste fixe [...] comme la page d'accueil de Facebook »
Chez moi, Facebook a une largeur fixe.
Et mon écran et suffisamment grand.
Pour les solutions :
- Tu peux répéter l'image, mais ça ne sera pas top si l'image n'est pas prévue pour cela.
- Faire un dégradé au niveau des bordures.
Je n'ai aucune image d'arrière-plan sur ce site.
« L'idéal est de faire un design qui serait extensible mais qu'a partir d'une certaine résolution le site reste fixe [...] comme la page d'accueil de Facebook »
Chez moi, Facebook a une largeur fixe.
Et mon écran et suffisamment grand.
Pour les solutions :
- Tu peux répéter l'image, mais ça ne sera pas top si l'image n'est pas prévue pour cela.
- Faire un dégradé au niveau des bordures.
Et bien oui Facebook a bien une image de fond, c'est un dégradé de couleurs du blanc vers le bleu ! Non ?
Je ne vois aucun dégradé.
Es-tu sûr que ce soit le thème original que tu utilises ?
Aurais-tu une extension permettant de modifier le thème ?
Voilà à quoi ça ressemble normalement :
http://www.cijoint.fr/cj201106/cijyx0xAxK.png
Es-tu sûr que ce soit le thème original que tu utilises ?
Aurais-tu une extension permettant de modifier le thème ?
Voilà à quoi ça ressemble normalement :
http://www.cijoint.fr/cj201106/cijyx0xAxK.png
Que le background ne se répète pas verticalement, c'est fait exprès.
Il s'arrête avant le pied de page, et c'est bien ainsi.
Par contre, horizontalement, il se répète à l'infini.
Il s'arrête avant le pied de page, et c'est bien ainsi.
Par contre, horizontalement, il se répète à l'infini.
Et bien sur moi et fb, les fond d'écran est couper quand on réduit la fenetre, j'ai fait une copie d'écran pour mieu me faire comprendre :
http://www.cijoint.fr/cj201106/cijbgpp5K5.png
http://www.cijoint.fr/cj201106/cijbgpp5K5.png
C'est un problème fréquent.
En fait, l'image d'arrière-plan est appliquée sur le body.
Le body a une largeur de 100%, donc la taille de la fenêtre.
Le background a donc une largeur égale.
Et si tu glisses vers la droite, tu apercevras la fin de l'arrière-plan.
La solution consiste à mettre le tout dans une div et d'appliquer l'arrière-plan à ce <div>.
Dans le cas où la taille du navigateur est trop grand, le div prendra automatiquement toute la largeur car c'est un élément block.
Et s'il contient du contenu plus large que le navigateur, il s'étendra.
En fait, l'image d'arrière-plan est appliquée sur le body.
Le body a une largeur de 100%, donc la taille de la fenêtre.
Le background a donc une largeur égale.
Et si tu glisses vers la droite, tu apercevras la fin de l'arrière-plan.
La solution consiste à mettre le tout dans une div et d'appliquer l'arrière-plan à ce <div>.
Dans le cas où la taille du navigateur est trop grand, le div prendra automatiquement toute la largeur car c'est un élément block.
Et s'il contient du contenu plus large que le navigateur, il s'étendra.