Forum-webmaster
Technique - programmation => HTML / CSS / XHTML => Message commencé par: Ardilla le le 23-10-2011 a 21:31:03

Titre: Problème de "centrage"
Posté par: Ardilla le le 23-10-2011 a 21:31:03

Bonsoir à tous,
Bon j'ai autant de mal à résoudre mon problème qu'à trouver un titre à mon post pour résumer mon problème!
Le voici :
Je souhaite créer un site web qui ait + / - la même apparence quel que soit le navigateur que l'on utilise et surtout la taille de l'écran.
En gros j'aimerai que ce soit un peu comme ce site : http://www.cinerex-lareole.com/
C'est-à-dire un fond d'écran (gris) qui prend + / - de place selon la taille de l'écran du visiteur, et un cadre toujours au centre (même si je m'amuse à rétrécir un peu ma fenêtre).

Alors dites moi comment faire ça ?

J'ai essayé de le faire... j'ai mis mon fond d'écran dans "body" avec margin left et right = auto (comme j'ai vu sur certains forums). Donc jusque là tout va bien quand je rétrécie ma fenêtre le fond rétrécie aussi.
Sauf que quand je mets une div, elle ne se déplace pas avec le fond d'écran.
Du coup c'est du grand n'importe quoi !!

Alors comment pourrais-je faire ?

Je précise que :
1. je suis débutant (mais peut-être l'auriez vous remarqué !)
2. je travaille sur dreamweaver.

En tout cas merci pour votre aide, je m'arrache les cheveux!

Bknne soirée,
Marine

Titre: Re:Problème de "centrage"
Posté par: seoreference le le 24-10-2011 a 12:16:36

salut,
dans la majeure partie des cas (c'est d'ailleurs le cas dans l'exemple que tu cites), la mise en forme se construit comme ça:
-1 image en background du body comme ce que tu as fait apparement.
- 1 div qui contient tout le site et qui est centrer (margin:auto). Sa largeur est fixe (dans ton exemple 1000px).

Je te conseille d'utiliser le plugin firebug sur firefox. Tu pourras étudier le code des sites qui te plaise et t'en inspirer.

Titre: Re:Problème de "centrage"
Posté par: Soundboy39 le le 24-10-2011 a 20:30:15

bonsoir marine,

Ceci est du CSS plutôt basique, pour que la largeur des pages soit synchro avec la taille
de l'ecran, il faut déterminer l'attribut CSS "width" en pourcentage
(%) est pas en pixel.


pour ton problème d'image de fond il faut utiliser une image qui pourra se répéter
sans faire un effet de mozaique, autrement un fond unie.

Ton CSS (pour ton body) devrait donc ressembler à ça :

body
{
background: repeat-x repeat-y;
width: 100%; (si tu veux que la page s'affiche sur la totalité de l'écran...sinon moins)
}

qu'on me corrige si je me trompe mais çà doit être ça...

Titre: Re:Problème de "centrage"
Posté par: MarvinLeRouge le le 24-10-2011 a 20:50:44

Pour le background tu peux aussi utiliser une seule image, centrée horizontalement, avec une couleur de substitution pour la continuer en cas de besoin. Mais tu dois la penser a) suffisamment large pour que ce cas se présente peu souvent b) suffisamment peu importante graphiquement pour ne pas poser une gène si elle est coupée en largeur

Titre: Re:Problème de "centrage"
Posté par: Pad le le 24-10-2011 a 20:54:47

ceci n'est pas correct : background: repeat-x repeat-y;

il vaut mieux écrire : background: url(image.jpg) repeat top left; ou bien juste background-repeat:repeat;

Titre: Re:Problème de "centrage"
Posté par: Soundboy39 le le 24-10-2011 a 21:38:04

Oui merci Pad, je viens de me rendre compte
que j'avais oublié de spécifier l'url... ::)


Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.