Problème d'affichage d'un background en fond de forum
3 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Problème d'affichage d'un background en fond de forum
Détails techniques
Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://nsp-d3.forumofficiel.com/
Description du problème
Bonsoir,Voici l'affichage de mon background sur Chrome :
- Spoiler:
Voici celui sur Safari :
- Spoiler:
J'essaye de garder la largeur des bordures haut et bas et que ça prenne tout l'espace.
Voici l'image de mon background :
- Spoiler:
Et pour terminer ma CSS :
- Code:
body {
background-attachment: fixed;
background-image: url(http://i66.tinypic.com/2ltk4yr.png);
background-position: center!important;
background-repeat: repeat-x;
background-size: 95% auto;
}
Merci à vous
Dernière édition par Ancients le Mar 12 Avr 2016 - 15:20, édité 1 fois
Re: Problème d'affichage d'un background en fond de forum
Coucou
Euh... y a un souci avec ton background-size non ?
Personnellement, j'aurai plutot mis :
et j'aurai supprimer le background-position (qui ne sert à rien avec un background-size) et le background-attachement (qui, mariait au background-size engendre des bug d'affichage sous safari).
Du coup :
Euh... y a un souci avec ton background-size non ?
Personnellement, j'aurai plutot mis :
- Code:
background-size: auto 100%;
et j'aurai supprimer le background-position (qui ne sert à rien avec un background-size) et le background-attachement (qui, mariait au background-size engendre des bug d'affichage sous safari).
Du coup :
- Code:
body {
background-image: url(http://i66.tinypic.com/2ltk4yr.png);
background-repeat: repeat-x;
background-size: auto 100%;
}
Re: Problème d'affichage d'un background en fond de forum
Bonjour mselle,
Ça ne garde pas la largeur des bordures de l'image de fond et ça bug en scrollant aussi : http://nsp-d3.forumofficiel.com/forum
Merci à vous
Ça ne garde pas la largeur des bordures de l'image de fond et ça bug en scrollant aussi : http://nsp-d3.forumofficiel.com/forum
Merci à vous
Re: Problème d'affichage d'un background en fond de forum
Bonjour,
Essayez ainsi :
J'ai divisé rapidement le fond : une bande en haut, une bande en bas, et la couleur de fond au milieu, de façon à pouvoir les positionner sans les déformer. Le résultat est-il ce que que vous souhaitez ?
Essayez ainsi :
- Code:
body {
background-color: #020403;
background-image: url(http://zupimages.net/up/16/15/c6ed.bmp), url(http://zupimages.net/up/16/15/d1vk.bmp);
background-size: auto, auto;
background-position: top center, bottom center;
background-attachment: fixed;
background-repeat: repeat-x, repeat-x;
}
J'ai divisé rapidement le fond : une bande en haut, une bande en bas, et la couleur de fond au milieu, de façon à pouvoir les positionner sans les déformer. Le résultat est-il ce que que vous souhaitez ?
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Problème d'affichage d'un background en fond de forum
Bonjour,
Merci pour votre réponse,
Votre code marche très bien sur mes pages sauf sur l'accueil avec la video en background ou un bout de la bordure est tronquée.
Bordure tronquée : http://nsp-d3.forumofficiel.com/forum
Bordure normale : http://nsp-d3.forumofficiel.com/memberlist
Merci à vous
Merci pour votre réponse,
Votre code marche très bien sur mes pages sauf sur l'accueil avec la video en background ou un bout de la bordure est tronquée.
Bordure tronquée : http://nsp-d3.forumofficiel.com/forum
Bordure normale : http://nsp-d3.forumofficiel.com/memberlist
Merci à vous
Re: Problème d'affichage d'un background en fond de forum
Alors je ne vois pas du tout la bordure sur la page d'accueil, peut être une question de résolution, auriez vous un screen ?
Où et comment exactement avez vous installé votre fond vidéo ?
Où et comment exactement avez vous installé votre fond vidéo ?
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Problème d'affichage d'un background en fond de forum
Voici la css de la video :
Voici son html :
La bordure n'est pas entière -->
Merci
- Code:
/*** VIDEO ***/
#video-background {
/* background: url(http://eu.battle.net/d3/static/images/reaper-of-souls/bg/malthael.jpg) repeat-x; peut être supprimé */
background-size: auto;
position: fixed;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
/* transition: 1s opacity; peut être supprimé */
z-index: -100;
}
Voici son html :
- Code:
<video autoplay="" id="video-background" xmlns="http://www.w3.org/1999/xhtml" loop="loop">
<source src="http://media.blizzard.com/d3/media/videos/reaper-of-souls/bg/malthael.webm" type="video/webm">
<source src="http://media.blizzard.com/d3/media/videos/reaper-of-souls/bg/malthael.mp4" type="video/mp4"></video>
La bordure n'est pas entière -->
Merci
Re: Problème d'affichage d'un background en fond de forum
(ce qui est intéressant surtout, c'est le fait que vous ayez mis votre vidéo via la page d'accueil du forum, c'est bien ça ?)
Alors votre vidéo est très grande, chez moi elle couvre complètement mon écran, d'où le fait que je ne vois pas du tout les bordures.
Ensuite, ce n'est pas un fond mais un élément positionné en dessous des autres : les bordures étant mises en fond de page, elles seront de toute façon toujours en dessous de la vidéo, d'où le fait qu'elles soient coupées si l'écran n'est pas assez grand.
On peut essayer d'ajouter les bordures comme éléments par dessus la vidéo :
Remplacez le code html de la video par :
On a ajouté deux blocs vides avec la vidéo. On va dimensionner et positionner ces blocs et mettre les bordures en fond. Ajoutez à ces fins les codes css suivants :
Alors votre vidéo est très grande, chez moi elle couvre complètement mon écran, d'où le fait que je ne vois pas du tout les bordures.
Ensuite, ce n'est pas un fond mais un élément positionné en dessous des autres : les bordures étant mises en fond de page, elles seront de toute façon toujours en dessous de la vidéo, d'où le fait qu'elles soient coupées si l'écran n'est pas assez grand.
On peut essayer d'ajouter les bordures comme éléments par dessus la vidéo :
Remplacez le code html de la video par :
- Code:
<video autoplay="" id="video-background" xmlns="http://www.w3.org/1999/xhtml" loop="loop">
<source src="http://media.blizzard.com/d3/media/videos/reaper-of-souls/bg/malthael.webm" type="video/webm">
<source src="http://media.blizzard.com/d3/media/videos/reaper-of-souls/bg/malthael.mp4" type="video/mp4"></video>
<div id="bord-haut"></div>
<div id="bord-bas"></div>
On a ajouté deux blocs vides avec la vidéo. On va dimensionner et positionner ces blocs et mettre les bordures en fond. Ajoutez à ces fins les codes css suivants :
- Code:
/*bordures par dessus video accueil*/
#bord-haut, #bord-bas {
position: fixed;
left: 0;
right: 0;
height: 93px;
z-index: -99;
background-repeat: repeat-x;
}
#bord-haut {
top: 0;
background: url(http://zupimages.net/up/16/15/c6ed.bmp);
background-position: top center;
}
#bord-bas {
bottom: 0;
background: url(http://zupimages.net/up/16/15/d1vk.bmp);
background-position: bottom center;
}
/*fin bordures par dessus video accueil*/
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Problème d'affichage d'un background en fond de forum
Le rendu est un peu spécial pour la vidéo, mais les bordures sont niquels
http://nsp-d3.forumofficiel.com/forum
http://nsp-d3.forumofficiel.com/forum
Re: Problème d'affichage d'un background en fond de forum
Pas chez moi,
attention le css n'était pas à remplacer, mais à ajouter à celui déjà présent pour la vidéo.
attention le css n'était pas à remplacer, mais à ajouter à celui déjà présent pour la vidéo.
Dernière édition par MlleAlys le Mar 12 Avr 2016 - 15:08, édité 1 fois
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Problème d'affichage d'un background en fond de forum
En effet, désolé.
La bordure sur l'index est en double.
J'ai remarqué que le problème venait du padding :
J'ai essayé ce code :
Ce qui centre la video mais ne résout pas le problème de la bordure
http://nsp-d3.forumofficiel.com/forum
Merci pour votre aide
La bordure sur l'index est en double.
J'ai remarqué que le problème venait du padding :
- Code:
div#main-content > * {
padding: 30px 0 30px 20px;
}
J'ai essayé ce code :
- Code:
div#main-content > #video-background {
padding: 0!important;
}
Ce qui centre la video mais ne résout pas le problème de la bordure
http://nsp-d3.forumofficiel.com/forum
Merci pour votre aide
Re: Problème d'affichage d'un background en fond de forum
Au code css
ajoutez padding: 0 !important; ce qui donne :
- Code:
#bord-haut, #bord-bas {
position: fixed;
left: 0;
right: 0;
height: 93px;
z-index: -99;
background-repeat: repeat-x;
}
ajoutez padding: 0 !important; ce qui donne :
- Code:
#bord-haut, #bord-bas {
position: fixed;
left: 0;
right: 0;
height: 93px;
z-index: -99;
background-repeat: repeat-x;
padding: 0 !important;
}
MlleAlys- Membre actif
- Messages : 5900
Inscrit(e) le : 12/09/2012
Re: Problème d'affichage d'un background en fond de forum
C'est niquel !
Merci beaucoup, j'apprécie votre aide.
Bonne journée
Merci beaucoup, j'apprécie votre aide.
Bonne journée
Sujets similaires
» Problème d'image de fond (background)
» background fond de forum
» Problème fond du forum
» Problème taille forum + fond sous-forum
» Bannière en Background + un deuxième fond
» background fond de forum
» Problème fond du forum
» Problème taille forum + fond sous-forum
» Bannière en Background + un deuxième fond
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum