Aller au contenu

Positionnement impossible en CSS ?


doomer2

Sujets conseillés

Bonjour à tous,

Me voilà confronter à un probléme que je n'arrive à résoudre. Je suis en train de faire une mise en page structuré comme ceci :

- header ; menu ; colonne gauche fluide en %, colonne centre 180px et colonne droite 200px;

Je souhaterais savoir si c'était possible de faire cela ?

Voici ce que j'ai fait :

Modele

Le résultat escompté :

1) Le haut de page :

Haut de la page

2) bas de page : Bas de la page

Legende : #centre (couleur orange)

#divers (couleur grise)

#contenugauche (couleur blanche)

Les problémes sont les suivants :

- le div divers doit rester à 200px et le div #centre à 180px. Le div #contenugauche doit être redimensionnable en fonction de la résolution.

Mais lorsque j'indique ces valeurs en px que dois je attribuer comme valeur à #contenugauche ?

- un probléme de positionnement puisque lorsque je redimensionne en 800*600, j'ai mon div#centre qui passe en dessous de #divers ?

- je souhaiterais que mon div#centre descende jusqu'en bas de mon conteneur mais même en utilisant height:100% cela ne fonctionne pas?

Si quelqu'un à une idée sur un de mes problémes, n'hésitait pas.

Je repart au travail pour essayer de résoudre ces problémes.

Merci d'avance à tous.

Lien vers le commentaire
Partager sur d’autres sites

Salut, tel que tu veux ta page, il me semble qu'un positionnement avec deux float est obligatoire...

Tu fais un float right avec ton contenu gris, un deuxieme float right avec ton contenu orange, et l'autre tu le laisses "couler" là ou ya de la place, c'est à dire à gauche.

#centre{float:right;width:180px;}

#divers {float:right;width:200px;}

Pour la hauteur, c'est un des gros problèmes du css, et les colonnes factices de pompage.net t'aideront peut-être, ou alors alsacreations avec les colonnes de même hauteur...

Voili voilà, travaille dans cette direction ;)

Lien vers le commentaire
Partager sur d’autres sites

Je vais être complètement hors-sujet et çe que je vais dire ne va pas faire avancer ton problème, je te prie de m'en excuser.

Mais

Apple n'apprécie pas trop les sites qui lui prennent ses graphismes. Ils en font fait fermer plus d'un (les dits graphismes sont sous copyright, Apple est donc dans son droit).

Donc un conseil: fais gaffe, ce serait dommage ;)

Lien vers le commentaire
Partager sur d’autres sites

Je comprends pas, je vois pas en quoi il s'agit d'une création de apple !!!

Cela vient de ma propre création.

Peux tu en dire plus ?

Merci

Je peux en dire plus. Mais un lien vaut mieux qu'un long discours ;) Modifié par Dudu
Lien vers le commentaire
Partager sur d’autres sites

Dudu, jte suis pas, les deux designs n'ont rien en rapport :/

Mais vraiment rien du tout... :|

Pourquoi tu dis ça ?

Lien vers le commentaire
Partager sur d’autres sites

http://dubcl.free.fr/modele/images/accessibilite.gif

=

accessibilite.gif

http://images.apple.com/macosx/features/vo...top20050412.jpg

=

indextop20050412.jpg

D'autre part je n'ai jamais parlé de design ou de création de page, j'ai parlé de graphismes. Donc ben les .. heu .. les graphismes, quoi..

Je peux pas être plus explicite, là :(

PS: c'est vraiment dommage que pour un petit conseil on en soit déjà à 3/4 messages hors-sujet, la prochaine fois je détaillerais à fond tout de suite, la ressemblance des 2 graphismes me paraissait pourtant évidente :unsure:

Lien vers le commentaire
Partager sur d’autres sites

Désolé, je n'avais pas vu..

C'est pas tant que ça, il n'a qu'a virer l'image :blush:, il ne perdra rien au design...

Fin du hors sujet !

Lien vers le commentaire
Partager sur d’autres sites

C'est doomer qui m'avait embrouillé lol, mais je te remercie pour lui Dudu de l'avoir averti, parce que j'aurais pas su le faire : je ne connais pas le site d'apple, et je n'avais pas fait gaffe au petit logo bleu non plus du site de doomer... :P

Enfin bon, faudrait qu'il revienne déjà :D lol

Lien vers le commentaire
Partager sur d’autres sites

Ok, je comprends mieux là. Cette image me servait juste à remplir mon site pour letester. Ce ne sont pas les images définitives.

Je vais retirer cela tout de suite.

Je te remercie tout de même de ta mise en garde.

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...