Design fixe et extensible

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 !

12 réponses

  1. avion-f16 Messages postés 19182 Date d'inscription   Statut Contributeur Dernière intervention   4 511
     
    Salut,

    Tu peux définir une largeur minimale avec min-width en CSS.
    1
  2. DoulyCreations Messages postés 265 Statut Membre 19
     
    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.
    1
  3. mabingo
     
    bon je te trouverais une solution merci
    0
  4. timo
     
    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
    0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. avion-f16 Messages postés 19182 Date d'inscription   Statut Contributeur Dernière intervention   4 511
     
    Le problème provient d'autre part.
    0
  7. timo
     
    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é...?
    0
  8. avion-f16 Messages postés 19182 Date d'inscription   Statut Contributeur Dernière intervention   4 511
     
    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.
    0
  9. timo
     
    Et bien oui Facebook a bien une image de fond, c'est un dégradé de couleurs du blanc vers le bleu ! Non ?
    0
  10. avion-f16 Messages postés 19182 Date d'inscription   Statut Contributeur Dernière intervention   4 511
     
    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
    0
  11. timo
     
    Oui la il n'y a aucun fond mais moi je parle de la page d'accueil...!
    0
  12. avion-f16 Messages postés 19182 Date d'inscription   Statut Contributeur Dernière intervention   4 511
     
    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.
    0
  13. timo
     
    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
    0
    1. avion-f16 Messages postés 19182 Date d'inscription   Statut Contributeur Dernière intervention   4 511
       
      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.
      0
    2. timo
       
      Ben j'ai déjà créer un <div> spécialement pour mon fond d'écran car il n'est pas dans mon body puisque je ne voulais que la parti centrale de mon site avec ce fond. Mais bon ce n'est pas trés grave au final
      0