Jump to content

Bloc "information utilisateur" flottant


Recommended Posts

BOnjour,

J'ai un petit problème avec le bloc "information utilisateur", alors que je l'ai greffé dans le header, et que cela s'emboite parfaitement dans ma bannière sur mon écran "16/9" de mon pc portable, sur le 4/3 de mon bureau, il glisse sous la bannière (cf photo). Savez-vous comme le fixer en haut ?

Merci bcp

Arnaud

6690_32CgW046TX37ww354bZu_t

Share this post


Link to post
Share on other sites
  • 7 months later...

Sa solution, ça a été de faire appel à Atch pour lui créer un nouveau design (http://www.jcpweb.fr)

Ce qui se passe dans ce site, c'est un float:left qui fait passer à la ligne dû à un ou plusieurs pixels en trop (le navigateur web n'ayant pas la place de positionner le bloc. il s'agit probablement ici de IE 6, qui confond et additionne les padding avec les margin, DONC il passe à la ligne.

Quel est ton problème, Florent ?

EDIT : Atch me murmure dans l'oreillette que ça pourrais aussi être l'image trop large qui dépasse et fait passer à la ligne.

Share this post


Link to post
Share on other sites

Salut SotEW,

ça tombe bien que ce soit toi qui me réponde.
En fait, j'ai utilisé ton super module "Sotew's adds" pour positionner ma bannière (Haut de Page). Par contre, j'aurais voulu y intégrer le bloc user (compte + login) et le bloc langues.

Je pense avoir trouver une solution, peut-être pas très propre mais efficace. J'ai ajouté un margin-top négatif au #header, et ça marche.

Ai-je bien fait ?

Share this post


Link to post
Share on other sites

hmmm, une façon plus "propre" serait de mettre l'image en fond du body (ou de page) à l'aide du css avec un no-repeat, et donc de ne pas se servir de mon module, mais du fichier global.css


Plus de précision : supposons que tu as une image que je vais nommée "banniere.png". Place là dans le dossier /themes/tontheme/img/


ensuite tu ouvres ton fichier global.css, et tu édites aux alentours de la ligne 182 :

/* global layout */
#page {
   width: 980px;
   margin: 0 auto 2px auto;
   text-align:left;
}




à remplacer par :

/* global layout */
#page {
   background: transparent url(../img/banniere.png) no-repeat;
   width: 980px;
   margin: 0 auto 2px auto;
   text-align:left;
}



ça devrait être un peu mieux. (fait juste attention à la largeur de cette image)

Share this post


Link to post
Share on other sites

Re,

Merci de me répondre aussi vite et aussi clairement.

Alors, j'ai fait comme tu as dit, sans utiliser ton module. Mais, il faut quand même que j'applique un margin-top positif au #header, pour que ma bannière ne glisse pas sous les colonnes Droite et Gauche.

Share this post


Link to post
Share on other sites

non, il faut que tu agrandisse le header afin qu'il dispose de toute la place nécessaire à l'affichage de ta bannière.

Regarde, toujours dans ton global.css, la section #header, tu dois avoir un height trop petit.

Share this post


Link to post
Share on other sites

Alors, pour info, j'utilise le thème d'origine.

Je n'ai pas de height dans le #header. En l'ajoutant, ça décale complètement mes blocs langues et user vers le haut, qui pour info sont placés dans le Top.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More