CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur: Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus! |
| [résolu]Problème décalage Navigation et footer | |
| K-Surf
{ Spécialiste }
Messages : 1707
| Coucou,
Ma navigation et mon footer sont décalés sur la gauche selon les résolutions. J'aimerais savoir pourquoi ? Par contre la barre de navigation quand on la voit déconnecter elle est décalée sur la gauche tant dis que connecter c'est bien dans le cadre.
Merci d'avance K-Surf |
Dernière édition par K-Surf le Dim 18 Aoû 2013, 07:30, édité 1 fois | |
| | | Nihil
{ Modérateur }
Messages : 1216
| Salut, Est ce que tu pourrais préciser le lien du forum en question, ainsi que détailler dans des points différents chacun de tes problèmes s'il te plait ? Si je suppose que le problème est ici : http://www.serialdesigner.net/ (comme sur ton profil), alors : • footer : Dans le css, tu as placé ton footer en utilisant un margin left fixé à 219px, pour qu'il sois aligné avec le reste du forum. Alors qu'en fait, le forum lui est centré par rapport à chaque écran... Donc si la résolution augmente, la distance entre la gauche du forum et la gauche de ton écran augmente (pour que le forum reste centré). Par contre, comme la valeur margin-left est fixée à 219px, il se décale. ---> Comment régler ça ? Il faut centrer automatiquement ton footer, et non pas avec une valeur absolue telle que 219px. Pour cela, il suffit d'enlever le margin-left: 219px et mettre à la place un margin: auto; - Code:
-
#footerPerso { margin: auto; } Je pense que cela devrait marcher ^^ • barre de navigationUne fois encore, le décalage vient du fait que le positionnement se fait avec des valeurs absolues, et que le positionnement se fait à partir de la taille de la fenêtre... Du coup en fonction de l'écran, il y a un décalage... Est ce que tu pourrai me fournir le template où tu as fait la modification de la barre de navigation s'il te plait ? Par contre je ne sais pas du tout d'où vient la différence connecté / déconnecté ... Tu aurais un compte test pour que je puisse y jeter un coup d'oeil ? | | |
| | | K-Surf
{ Spécialiste }
Messages : 1707
| Coucou, Merci de ta réponse. Oui c'est bien ce forum. Pour le footer j'ai essayé ca ne marche pas , c'est décaler sur la droite cette fois ci. Voici le tuto utiliser : http://forum.forumactif.com/t354259-phpbb2-avoir-une-barre-de-navigation-verticale Sinon le template pour la navigation : | | |
| | | Nihil
{ Modérateur }
Messages : 1216
| Pour ton footer, est ce que tu fais bien attention à enlever le margin-left: 219px ? Car je viens de faire un test, ça a l'air de bien marcher si je met avec un margin auto [screen] (là j'ai mis aussi un -8px pour laisser comme tu avais fait. D'ailleurs tu n'aurais pas besoin de ce -8px, il suffirait de mettre à ton body un margin de 0 px ) | | |
| | | K-Surf
{ Spécialiste }
Messages : 1707
| Ça marche , reste plus que la barre de navigation, je sais pas pourquoi hier ça marchait pas | | |
| | | Nihil
{ Modérateur }
Messages : 1216
| Alors pour ta navigation, pour ma résolution elle se place plutôt bien, par contre avec une résolution plus grande, elle se déplace ^^ - Spoiler:
Ma résolution : Autre résolution :
En effet, là il se place à left: 65%; donc plus l'écran est large, plus la valeur de "65%" augmente, plus il va se décaler vers la gauche. En fait, pour que le positionnement sois le même sur chaque écran, il faut faire attention à la notion de positionnement absolu et positionnement relatif. Ainsi, il nous faut fixer un bloc "référence", et ta div de navigation sera placée par rapport à lui. (je te laisse faire quelques recherches sur le "position" en CSS hein, pour bien comprendre mon charabia ^^) Ainsi par exemple tu mets la table "bodylinewidth" en référence, et ensuite tu places ta div contenant la navigation en fonction : - Code:
-
table.bodylinewidth { position: relative; }
Et tu remplaces le " left: 65%;" par " right: 90px;" | | |
| | | K-Surf
{ Spécialiste }
Messages : 1707
| Ça marche niquel , par contre en résumer on a rajouté une sorte "d'ancre" a la div pour savoir ou elle doit ce placer ? | | |
| | | Nihil
{ Modérateur }
Messages : 1216
| Voilà, le position : relative (sur la table bodylinewidth) sert d'ancre, de marqueur, de référent (appelle ça comme tu veux ^^) pour le position : absolute (sur la div que l'on doit placer).
Contente d'avoir pu t'aider (: | | |
| | | K-Surf
{ Spécialiste }
Messages : 1707
| Ok merci j'ai compris | | |
| | | Contenu sponsorisé
| | | | | [résolu]Problème décalage Navigation et footer | |
|
Sujets similaires | |
|
| Permission de ce forum: | Vous ne pouvez pas répondre aux sujets dans ce forum
| |
| |
| |
|
| Partenaires Or
|