Ajouter des bordures/encadrement autour du forum (gauche & droite)

[Hitokiri]

Détails techniques

Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour,

Ayant choisi un thème où il n'y a pas de bordure de base je ne sais comment en ajouter.



Au mieux en extérieur du forum comme ci-dessus.
La "bordure" sera une image qui se répétera tout le long.

Merci.

[Clark Mercer]

Hellow :3

Il y a un sujet tout juste ici qui pourrait vous aider (il suffit de modifier le : 0 0 0 30 repeat; pour avoir des deux côtés, enfin c'est ce que j'ai essayé et le tout à fonctionné parfaitement en mettant le 30 partout o/)

[Hitokiri]

Oui je suis tomber sur ce sujet avant de poster, mais étant très novice, l'auteur semble avoir fais une modif qu'il ne cite pas, peux-tu me mettre le CSS exact pour la faire apparaître à droite et à gauche (deux images différentes) ? S'il te plaît ? :3

EDIT : J'ai tester le code de l'autre sujet juste pour voir, elle apparaît bien (à gauche) mais est couper en haut et en bas laissant un peu de vide.

[Clark Mercer]

J'ai testé pour l'avoir des deux côté et ça fonctionnais lorsque je mettais ceci dans le css :

Code:

.bodyline {
border-image: url("url_de_l'image") 30 30 30 30 repeat;
border-width: 30px;}

Je ne sais pas si tu avais tenté le coup ? xD


Edit: Je viens de voir ton edit :3 Tu pourrais me faire une capture écran ? Je suis plus visuelle (a)

[Hitokiri]

Merci beaucoup !
Désolé je ne connais pas grand chose, je peaufine au fur et à mesure x).

EDIT : Je viens de voir ton edite (), avec ton code tout fonctionne (pas de vide) sauf celui de base du forum mais avec l'autre code l'image s'arrêter avant.

[Clark Mercer]

Je suis allé voir sur ton forum en fait, et j'ai vu l'espace en question C'est car il faudrait coller ton cadre de forum en haut et en bas je suppose. Tu peux avoir les codes requis dans ce sujet ici

voilà

[Hitokiri]

Merci, ce n'était pas le soucis que j'avais rencontré, l'image s'arrêter bien avant avec le code de l'autre sujet. Mais sinon je vais le coller ça rendra mieux je pense.

EDIT : Je viens de voir que la bordure de droite n'est pas en "effet miroir" .

[Invité]

Salut Hitokiri,
juste pour voir le lien de ton fofo .

Edit , les images sont bien placées de mon côté .


a++

[Hitokiri]

Forum : http://lcmt.taguilde.net/

Au début je voulais mettre une image PNG non "carré" mais avec ce code ca augmente la taille du forum en même temps donc j'ai créer une image "carré" ==> https://www.zupimages.net/up/14/48/vswl.png

Mais une fois mise avec le code qu'on m'as passer ca donne ca : https://www.zupimages.net/up/14/48/tulj.jpg

Donc un énorme zoom ...

[Clark Mercer]

Tu dois jouer avec ceci :

border-width: 30px

donc réduire le nombre de px pour qu'il soit moins large :3

[Hitokiri]

Erf, j'avais essayer de changer les "30 30 30 30" x).

Merci .

[Invité]

Re,

Forum : http://lcmt.taguilde.net/

Au début je voulais mettre une image PNG non "carré" mais avec ce code ca augmente la taille du forum en même temps donc j'ai créer une image ==> https://www.zupimages.net/up/14/48/vswl.png

Mais une fois mise avec le code qu'on m'as passer ca donne ca : https://www.zupimages.net/up/14/48/tulj.jpg

Donc un énorme zoom ...

Ta css doit être ainsi:

Code:


.bodyline{
    border-image: url('http://www.zupimages.net/up/14/48/vswl.png') 30 30 30 30 repeat repeat;
    border-width: 14px;
}



L'image à une largeur de 14px .

a++

[Hitokiri]

Oui je viens de modifier .

J'en ai profiter pour rajouter des bord noir (2 pixel en plus)

Mais une fois tout bien changer, l'image et comme aplati a certain endroit : /.

[Clark Mercer]

Je suis allé voir sur ton forum et je ne comprend pas ? Qu'est-ce que tu veux dire par aplati ? : |

[Hitokiri]

Rapide montage : https://www.zupimages.net/up/14/48/qqye.jpg

On vois bien que l'image originelle (droite), n'apparaît pas correctement (gauche).

EDIT : Je crois savoir pourquoi, j'ai remarquer qu'il ne coupe pas l'image si elle est trop grande (la dernière) mais rétréci toute les images pour faire exactement la taille du forum de haut en bas, ce qui fait que les images sont tronqué :/

[Invité]

Re,

Oui je viens de modifier .

J'en ai profiter pour rajouter des bord noir (2 pixel en plus)

Mais une fois tout bien changer, l'image et comme aplati a certain endroit : /.

Ton forum a une apparence tout à fait normal et les bordures imagés sont respectées .

Vide ton cache Hitokiri .

a++

[Hitokiri]

Rapide montage : https://www.zupimages.net/up/14/48/qqye.jpg

On vois bien que l'image originelle (droite), n'apparaît pas correctement (gauche).

EDIT : Je crois savoir pourquoi, j'ai remarquer qu'il ne coupe pas l'image si elle est trop grande (la dernière) mais rétréci toute les images pour faire exactement la taille du forum de haut en bas, ce qui fait que les images sont tronqué :/

Non il y a bien un soucis, il prend en compte la hauteur de l'image et les tronque si la page actuel n'est pas au pixel prêt identique à ma bordure. (cf: mon sujet au dessus)

[Clark Mercer]

Aaah oui je vois, l'image se ''contracte'' aux deux extrémités o_o C'est peut-être à cause du CSS body du coup ._. Puisqu'il a été modifié pour que le cadre du forum soit collé en haut et en bas ._. Peut-être essayer de jouer dedans? Ou encore le donner ici voir ce que tu y a mis.

[Invité]

Re,

on va modifier ta css:

supprimes l'actuel et remplaces par:

Code:


.bodyline
{
background-image: url('http://www.zupimages.net/up/14/48/vswl.png'),
url('http://www.zupimages.net/up/14/48/vswl.png');
background-repeat:repeat-y;
background-position:left , right;
padding:0 15px 0 15px;
}



a++

[Hitokiri]

Re,

on va modifier ta css:

supprimes l'actuel et remplaces par:

Code:


.bodyline
{
background-image: url('http://www.zupimages.net/up/14/48/vswl.png'),
url('http://www.zupimages.net/up/14/48/vswl.png');
background-repeat:repeat-y;
background-position:left , right;
padding:0 15px 0 15px;
}



a++

L'image final est ==> https://www.zupimages.net/up/14/48/9v6s.png

J'ai changer les liens plus les deux pixels en plus mais le rendu n'est pas correct ><. Il rajoute un pixel après le contour noir que j'ai fais autour de mon image ...

EDIT : C'etais le "cadre du forum".

Merci bien, je vais me débrouiller avec ça.

[Invité]

Re,

tu veux parler de la bordure noire ?

La css par defaut ajoute une bordure noire,
Donc ajoutes ceci:

Code:

border:none !important;

a++

[Hitokiri]

Re,

tu veux parler de la bordure noire ?

La css par defaut ajoute une bordure noire,
Donc ajoutes ceci:

Code:

border:none !important;

a++

Oui merci.

Une dernière petit chose. Avec ton nouveau code (Milouze14) la bordure ce colle directement aux cadres des catégories (alors qu'avant non) serait-il possible d'avoir une marge entre les deux ?

[Invité]

Re,
augmentes les valeurs ici:

Code:

padding:0 15px 0 15px;

passe 15 à 20 par exemple .

a++

[Hitokiri]

Super, merci.