AccueilMembres connectés récemment
[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation
2 participants
Page 1 sur 1 • Partagez
- Kid13
-
Dim 17 Mai 2020 - 8:28
- Version du forum :PHPBB2
- Templates modifiés :oui
- Navigateur :Firefox
Alors mon deuxieme probleme, après que mon premier ait été si rapidement résolu est le suivant :
La barre ou sont présentes les fonctionnalités (Accueil S'enregistrer Connection ) est beaucoups trop large, elle prend toute la largeur, j'aurais aimé qu'elle s'adapte aux nombres de fonctionnalité pour les visiteurs à savoir trois
Concernant les fonctionnalités présentes en tant qu'admin connecté ce sont les suivantes : Accueil, FAQ, rechercher, membres, groupes, profils , messagerie et deconnection. Mais dans les faits plus tard j'aurais aimé réussir a virer FAQ et rechercher de cette barre également mais c'est pas très génant pour le moment.
Donc concretement j'aimerais que la barre s'adapte à mes trois options visiteurs et qu'elle ne soit pas collée à mon forum en dessous, en laissant un espace pour aérer.
Voici ce que j'aurais aimé avoir :
![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Fofo_m10](https://i.servimg.com/u/f38/19/35/60/15/fofo_m10.png)
La barre ou sont présentes les fonctionnalités (Accueil S'enregistrer Connection ) est beaucoups trop large, elle prend toute la largeur, j'aurais aimé qu'elle s'adapte aux nombres de fonctionnalité pour les visiteurs à savoir trois
Concernant les fonctionnalités présentes en tant qu'admin connecté ce sont les suivantes : Accueil, FAQ, rechercher, membres, groupes, profils , messagerie et deconnection. Mais dans les faits plus tard j'aurais aimé réussir a virer FAQ et rechercher de cette barre également mais c'est pas très génant pour le moment.
Donc concretement j'aimerais que la barre s'adapte à mes trois options visiteurs et qu'elle ne soit pas collée à mon forum en dessous, en laissant un espace pour aérer.
Voici ce que j'aurais aimé avoir :
![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Fofo_m10](https://servimg.com/r/3819356015/fofo_m10.png)
.- Milouze14
Fondateur -
Dim 17 Mai 2020 - 8:52
Ah ben si tu n'as pas dormis, il est vrai que cela doit commencer à être dur ..
Alors pour ta barre de navigation et non la Toolbar.
On va créer un script qui va ajouter une class qui va nous permettre de réduire la largeur de cette dernière.
Et ajouter un saut de ligne afin de laisser une petite marge avant le début de ton fofo.
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.
Déposer ceci:
Penser a cliquer sur le bouton
Il faut toujours penser que sur la plupart des codages html,
on se base sur 100% pour les largeurs.
J'ai défini une largeur de 30% pour les invités.
Puis un margin-left de 35%
Donc 35% + 30% et d'office 35% de la droite(mais nous ne sommes pas obligé de le renseigner dans la feuille de style , mais il faut en tenir compte pour le calcul).
Nous arrivons à 100% .
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Ajouter ceci:
Penser a cliquer sur le bouton![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Sans_t10](https://i.servimg.com/u/f87/11/26/21/37/sans_t10.png)
Et voilou Hedi.
Alors pour ta barre de navigation et non la Toolbar.
On va créer un script qui va ajouter une class qui va nous permettre de réduire la largeur de cette dernière.
Et ajouter un saut de ligne afin de laisser une petite marge avant le début de ton fofo.
Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript
Mettre un titre explicite.
Cocher sur toutes les pages.
Déposer ceci:
- Code:
$(function() {
if (_userdata["user_id"] < (0)){
$('.M14_NAV_BAR').addClass('invite');
$('.M14_NAV_BAR.invite').after('<br />');
}});
Penser a cliquer sur le bouton
Il faut toujours penser que sur la plupart des codages html,
on se base sur 100% pour les largeurs.
J'ai défini une largeur de 30% pour les invités.
Puis un margin-left de 35%
Donc 35% + 30% et d'office 35% de la droite(mais nous ne sommes pas obligé de le renseigner dans la feuille de style , mais il faut en tenir compte pour le calcul).
Nous arrivons à 100% .
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Ajouter ceci:
- Code:
/*LARGEUR DE LA BARRE DE NAVIGATION POUR LES INVITES*/
.M14_NAV_BAR.invite
{
width:30%;
margin-left:35%;
}
Penser a cliquer sur le bouton
![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Sans_t10](https://servimg.com/r/8711262137/sans_t10.png)
Et voilou Hedi.
![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Unknown](https://cdn.discordapp.com/attachments/294880848950460416/711473946553352222/unknown.png)
![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Unknown](https://cdn.discordapp.com/attachments/294880848950460416/711474368105939014/unknown.png)
![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Unknown](https://cdn.discordapp.com/attachments/294880848950460416/711475132870295572/unknown.png)
- Milouze14Fondateur
-
Dim 17 Mai 2020 - 9:09
Hum, c'est fonctionnel sur ton fofo, il faut surement bien actualiser ton navigateur en appuyant simultanément sur les touches CTRL et F5 de ton clavier.
Si la hauteur n'est pas suffisante entre le fofo et la barre de navigation , tu peux remplacer:
Par:
Edit:
Merci de me donner les styles ou scripts en te servant du bouton de l'éditeur
Si la hauteur n'est pas suffisante entre le fofo et la barre de navigation , tu peux remplacer:
- Code:
/*LARGEUR DE LA BARRE DE NAVIGATION POUR LES INVITES*/
.M14_NAV_BAR.invite
{
width:30%;
margin-left:35%;
}
Par:
- Code:
/*LARGEUR DE LA BARRE DE NAVIGATION POUR LES INVITES*/
.M14_NAV_BAR.invite
{
width:30%;
margin-left:35%;
margin-bottom:60px;
}
Edit:
Merci de me donner les styles ou scripts en te servant du bouton de l'éditeur
- Kid13
-
Dim 17 Mai 2020 - 9:18
Euh j'ai pas réellement compris ta question mais sinon ca me derange pas de te donner les acces a mon fofo si tu veux. La seul chose que j'aime pas trop la, c'est que c'est pas centré l'écriture au niveau de la barre noir et que c'est un poil trop grand encore
Edit : Désolé j'avais prevenu j'suis un tanche en informatique mdr
Edit : Désolé j'avais prevenu j'suis un tanche en informatique mdr
- Milouze14Fondateur
-
Dim 17 Mai 2020 - 9:28
Euh j'ai pas réellement compris ta question mais sinon ca me derange pas de te donner les acces a mon fofo si tu veux
En fait , tu me donnes des captures alors que moi je désires avoir le contenu réel, c'est plus parlant (enfin pour moi
).
La seul chose que j'aime pas trop la, c'est que c'est pas centré l'écriture au niveau de la barre noir et que c'est un poil trop grand encore
Pour l'écriture centrée, c'est le style par défaut de la css de base que propose Forumactif.
On va corriger cela:
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style
Ajouter ceci:
- Code:
.M14_NAV_BAR ul li
{margin: 20px 0px 20px 0px !important;}
Penser a cliquer sur le bouton
Pour réduire encore, il faut modifier cela dans ce style déjà présent :
- Code:
/*LARGEUR DE LA BARRE DE NAVIGATION POUR LES INVITES*/
.M14_NAV_BAR.invite
{
width:30%;
margin-left:35%;
margin-bottom:60px;
}
Modifier la valeur du 30% avec une valeur inférieure et augmenter la valeur du 35%
Admettons que tu souhaites mettre 26%
Il faudra remplacer par
- Code:
/*LARGEUR DE LA BARRE DE NAVIGATION POUR LES INVITES*/
.M14_NAV_BAR.invite
{
width:26%;
margin-left:37%;
margin-bottom:60px;
}
Edit : Désolé j'avais prevenu j'suis un tanche en informatique mdr
Il faut bien commencer Hedi
- Kid13
-
Dim 17 Mai 2020 - 9:32
Ah la c'est centré niquel. J'ai plus ou moins compris les % par contre si on passe de 30 a 26 et de 35 a 37 c'est pas proportionnel du coup comment du calcul ca?
Edit : en arrivant a 18% et 41% ca donne un truc niquel merci beaucoups c'est parfait la
Edit2 : Tu m'as beaucoup aidé, merci d'avoir pris de ton temps et de ta patience pour m'aider et m'expliquer j'vais allez pioncer parce que j'arrive plus a garder les yeux ouverts bonne nuit ou bonne journée ^^
Edit : en arrivant a 18% et 41% ca donne un truc niquel merci beaucoups c'est parfait la
Edit2 : Tu m'as beaucoup aidé, merci d'avoir pris de ton temps et de ta patience pour m'aider et m'expliquer j'vais allez pioncer parce que j'arrive plus a garder les yeux ouverts bonne nuit ou bonne journée ^^
- Milouze14Fondateur
-
Dim 17 Mai 2020 - 10:10
Bonne nuit alors ;) .
Alors pour les explications je l'ai donné ici Hedi :
https://www.milouze14.com/t32646-modernbb-probleme-d-ajustement-de-la-barre-de-la-barre-de-navigation#621649
Pour être plus simple et pour être en relation avec ce style ajouté:
Il ne faut pas diminuer la largeur car il faut prendre en compte le style mentionné au dessus Hedi.
Il ajoute une marge aussi......
On part toujours de 100%.
Si tu veux une largeur de 20%:
100- 20 =80
On obtient 80.
Que l'on divise en deux:
40
Comme on ne se soucis par de la marge droite mais que de celle de gauche:
Ce style serait parfait en remplacement de l'autre Hedi:
Alors pour les explications je l'ai donné ici Hedi :
https://www.milouze14.com/t32646-modernbb-probleme-d-ajustement-de-la-barre-de-la-barre-de-navigation#621649
Pour être plus simple et pour être en relation avec ce style ajouté:
- Code:
.M14_NAV_BAR ul li
{margin: 20px 0px 20px 0px !important;}
Il ne faut pas diminuer la largeur car il faut prendre en compte le style mentionné au dessus Hedi.
Il ajoute une marge aussi......
On part toujours de 100%.
Si tu veux une largeur de 20%:
- Code:
width: 20%;
100- 20 =80
On obtient 80.
Que l'on divise en deux:
40
Comme on ne se soucis par de la marge droite mais que de celle de gauche:
- Code:
margin-left: 40%;
Ce style serait parfait en remplacement de l'autre Hedi:
- Code:
.M14_NAV_BAR.invite {
margin-bottom: 60px;
margin-left: 40%;
width: 20%;
}
![[MODERNBB] Probleme d'ajustement de la barre de la barre de navigation Unknown](https://cdn.discordapp.com/attachments/294880848950460416/711579649100218448/unknown.png)
Sujets similaires
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum