Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Enlever le fond blanc de la PA

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Enlever le fond blanc de la PA

Message par Kiraxa le Dim 11 Aoû 2019 - 22:28

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :
Voir l'image:
Enlever le fond blanc de la PA 1565555121-capture-d-ecran-2019-08-11-a-22-25-12

Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://onepieceanarchy.forumactif.com/

Description du problème

Bonjour,

Malgré l'épluchage des sujets à propos de ce souci, je n'ai pas réussi à enlever le fond blanc présent derrière ma page d'accueil... (cf capture d'écran jointe)

Quelqu'un peut-il m'aider s'il vous plait ?

Voici mon code correspondant (page HTML) mise en "iframe" dans généralités :
Code:
<div class="PAspar1">
 <iframe name="" src="http://kiraxa.forumactif.com/h4-pa-v2" scrolling="no" frameborder="no" style="width: 1000px; height: 470px;">
 </iframe>
</div><br />

La page HTML en question :
Code:
<div style="width: 999px; height: 400px; background-image: url();margin:0 auto;">
<div class="bcgpa"><div class="sp-slideshow">
 
<!--ici genre tu touches pas stp c'est les boutons ronds--><input id="button-1" type="radio" name="radio-set" class="sp-selector-1" checked="checked" />
<label for="button-1" class="button-label-1"></label>
<input id="button-2" type="radio" name="radio-set" class="sp-selector-2" />
<label for="button-2" class="button-label-2"></label>
<input id="button-3" type="radio" name="radio-set" class="sp-selector-3" />
<label for="button-3" class="button-label-3"></label>

<!--et là du coup c'est les flèches--><label for="button-1" class="sp-arrow sp-a1"></label>
<label for="button-2" class="sp-arrow sp-a2"></label>
<label for="button-3" class="sp-arrow sp-a3"></label>
<div class="sp-content"><div class="sp-parallax-bg"></div>
<!--ul = le slide général genre là où y'a le fond quoi; li = l'intérieur de chauqe slide, en gros-->
<ul class="sp-slider clearfix">
<li><div style="width: 999px; height: 400px; margin-left: -60px;"><div class="imgrandom" style="float:left; margin-left:40px;margin-top:40px;"><img src="http://via.placeholder.com/250x320"/></div><div class="blancdroite"><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div><div class="linku"><a href="/">Link here</a></div></div><div class="blokenba" style="color:white;">
 CONTEXTE <br/><br/><center><a href="#" style="font-family:arial;font-size:12px;color:#eaeaea;text-decoration:none!important;font-style:italic;">+ more ?</a></center>
  </div><div style="position:relative;margin-left:740px;top:-295px;width:150px;height:300px;font-family:arial;font-size:12px;color:white;text-align:justify;">Crédits : Page d'accueil réalisée par John et adaptée par Kiraxa. Toute reproduction - qu'elle soit totale ou partielle - est formellement interdite. L'ensemble du forum appartient à Kiraxa, merci également de respecter les propriétés intellectuelles des écrits du staff et des membres du forum. Certains éléments graphiques ont été empruntés à des forums de libre service crédités dans l'annexe dédiée.</div>
 </div></li>
<li><div style="width: 999px; height: 400px; margin-left: -75px;">
  <!--Le staff et le hover du coup--><div class="pastaff"><div class="pas2"><div class="pas4">Staff<br/>Statut
</div></div>
  <div class="pas3"><div class="pas4">Staff<br/>Statut
</div></div>
  <div class="pas5"><div class="pas4">Staff<br/>Statut
</div></div>
  <div class="pas6"><div class="pas4">Staff<br/>Statut
</div></div></div>
 <div class="blokd">
<!--predef'--><div class="predeftit">personnages recherchés</div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div><div class="predefi"><a href="/"><img src="http://via.placeholder.com/60x60"/></a></div>
<div class="trukrond" style="margin-top:66px;margin-left: 90px;width: 100px;height: 100px;"><img src="http://via.placeholder.com/100x100"/></div><div style="font-size:12px;color:white;width:100px;font-family:roboto;margin-left:190px;margin-top:-70px;">optimisé pour google chrome</div></div>
</div></li>

<li><div style="width: 999px; height: 400px; margin-left: -65px;">
<!--les groupes j'crois ?--><div class="tit">Zelos</div><div class="txtgr">
Nec vox accusatoris ulla licet subditicii in his malorum quaerebatur acervis ut saltem specie tenus crimina praescriptis legum committerentur, quod aliquotiens fecere principes saevi: sed quicquid Caesaris implacabilitati sedisset, id velut fas iusque perpensum confestim urgebatur impleri.
Ideoque fertur neminem aliquando ob haec vel similia poenae addictum oblato de more elogio revocari iussisse, quod inexorabiles quoque principes factitarunt. et exitiale hoc vitium, quod in aliis non numquam intepescit, in illo aetatis progressu effervescebat, obstinatum eius propositum accendente adulatorum cohorte.
</div>
<div class="tit">chronos</div><div class="txtgr">
Nec vox accusatoris ulla licet subditicii in his malorum quaerebatur acervis ut saltem specie tenus crimina praescriptis legum committerentur, quod aliquotiens fecere principes saevi: sed quicquid Caesaris implacabilitati sedisset, id velut fas iusque perpensum confestim urgebatur impleri.
Ideoque fertur neminem aliquando ob haec vel similia poenae addictum oblato de more elogio revocari iussisse, quod inexorabiles quoque principes factitarunt. et exitiale hoc vitium, quod in aliis non numquam intepescit, in illo aetatis progressu effervescebat, obstinatum eius propositum accendente adulatorum cohorte.
</div>
<div class="tit">Phobos</div><div class="txtgr">
Nec vox accusatoris ulla licet subditicii in his malorum quaerebatur acervis ut saltem specie tenus crimina praescriptis legum committerentur, quod aliquotiens fecere principes saevi: sed quicquid Caesaris implacabilitati sedisset, id velut fas iusque perpensum confestim urgebatur impleri.
Ideoque fertur neminem aliquando ob haec vel similia poenae addictum oblato de more elogio revocari iussisse, quod inexorabiles quoque principes factitarunt. et exitiale hoc vitium, quod in aliis non numquam intepescit, in illo aetatis progressu effervescebat, obstinatum eius propositum accendente adulatorum cohorte.
</div>
<div class="tit">Gïa</div><div class="txtgr">
Nec vox accusatoris ulla licet subditicii in his malorum quaerebatur acervis ut saltem specie tenus crimina praescriptis legum committerentur, quod aliquotiens fecere principes saevi: sed quicquid Caesaris implacabilitati sedisset, id velut fas iusque perpensum confestim urgebatur impleri.
Ideoque fertur neminem aliquando ob haec vel similia poenae addictum oblato de more elogio revocari iussisse, quod inexorabiles quoque principes factitarunt. et exitiale hoc vitium, quod in aliis non numquam intepescit, in illo aetatis progressu effervescebat, obstinatum eius propositum accendente adulatorum cohorte.
</div>
</div></li>

</ul></div></div>

</div></div>

<style>
.txtgr {
  display:inline-block;
  color:white;
  font-size:13px;
  font-style:italic;
  text-align:justify;
  margin:5px;
  font-family:roboto;
  width:160px;
  position:relative;
  top:80px;
  left:15px;
  overflow:auto;
  height:250px;
}
.tit {
  display:inline-block;
  color:white;
  position:absolute;
  font-family:roboto;
  font-style:italic;
  font-size:20px;
  text-transform:uppercase;
  text-align:center;
  width:160px;
  margin-left:18px;
  margin-top:50px;
}
.txtgr::-webkit-scrollbar {
  width: 6px;
  background: #eaeaea;
}
.txtgr::-webkit-scrollbar {
  width: 6px;
}
.txtgr::-webkit-scrollbar-thumb {
  background-color: #ca1e53;
}
.txtgr::-webkit-scrollbar-track {
  background-color: #111;
  border: 0px solid #eaeaea;
}
.pastaff {
width:160px;
height:300px;
float:left;
padding:10px;
margin-left:80px;
margin-top:50px;
font-family:roboto;
}
.pas2 {
overflow:hidden;
width:160px; height:60px;
background:url('http://image.noelshack.com/fichiers/2016/34/1471982126-rileypa.png');
margin-top:10px;
}
.pas4 {
padding-top:15px;
color:white;
text-align:center;
text-transform:uppercase;
font-size:11px;
transition: 300ms all ease;
opacity:0.8;
background:black;
height:60px;
width:160px; margin-top:60px;
}
.pas2:hover .pas4 {
  margin-top:0px;
}
.pas3 {
overflow:hidden;
width:160px;
height:60px;
background:url('http://image.noelshack.com/fichiers/2016/34/1471982126-klauspa.png');
margin-top:10px;
}
.pas3:hover .pas4 {
margin-top:0px;
}
.pas5 {overflow:hidden;
width:160px;
height:60px;
background:url('http://image.noelshack.com/fichiers/2016/34/1471982126-incopa.png');
margin-top:10px;
}
.pas5:hover .pas4 {
margin-top:0px;
}
.pas6 {overflow:hidden;
width:160px;
height:60px;
background:url('http://image.noelshack.com/fichiers/2016/34/1471982126-incopa.png');
margin-top:10px;
}
.pas6:hover .pas4 {
margin-top:0px;
}
.predefi {
position: relative;
top: 64px;
display: inline-block;  
margin: 5px;
left: -25px;
}
.trukrond img{
border-radius:100%;
width:100px;
height:100px;
}
.blokd {
width:480px;
height:350px;
padding:10px;
float:right;
}
.predeftit {
border-bottom:2px solid white;
width:300px;
position:relative;
top:60px;
text-align:left;
color:white;
font-family:roboto;
font-size:15px;
}
.blancdroite {
  width:380px;
  height:78px;
  padding:5px;
  background:white;
  float:right;
  margin:40px;
  position:relative;
  right:240px;
}
.imgrandom {
  position:relative;
  left:20px;
}
.linku {
  padding:5px;
  background:#eaeaea;
  display:inline-block;
  width:80px;
  margin:2px;
  transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all;
}
  .linku:hover
  {
  background:#d10a26
  }
.linku a {
  font-family:'roboto mono', monospace;
  color:black;
  text-decoration:none;
  text-transform:lowercase;
  font-size:10px;
}
.blokenba {
  float:right;
  width:390px;
  padding:5px;
  height:190px;
  margin-top:-30px;
  background:transparent;
  color:white;
  margin-right:275px;
  color:black;
  text-align:justify;
  font-size:12px;
  font-family:roboto;
  overflow:auto;
}
.blokenba::-webkit-scrollbar {
  width: 6px;
  background: #eaeaea;
}
.blokenba::-webkit-scrollbar {
  width: 6px;
}
.blokenba::-webkit-scrollbar-thumb {
  background-color: #ca1e53;
}
.blokenba::-webkit-scrollbar-track {
  background-color: #111;
  border: 2px solid #eaeaea;
}
.bcgpa { background-color: #212121;}
  .sp-slideshow { position: relative; margin: 0px; width: 999px; height: 400px;}
.sp-content {  position: relative; width: 100%; height: 100%; overflow: hidden;}
.sp-parallax-bg { background-size: cover; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;}
.sp-slideshow input { position: absolute; bottom: 15px; left: 50%; width: 9px; height: 9px; z-index: 1001; cursor: pointer; opacity: 0;}
.sp-slideshow input + label { position: absolute;bottom: 15px;left: 50%;width: 10px;height: 10px;display: block;z-index: 1000; -webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;-webkit-transition: background-color linear 0.1s;-moz-transition: background-color linear 0.1s;-o-transition: background-color linear 0.1s;-ms-transition: background-color linear 0.1s;transition: background-color linear 0.1s;}
.sp-slideshow input:checked + label {background-color: none;}
.sp-selector-1, .button-label-1 {margin-left: -36px;}
.sp-selector-2, .button-label-2 { margin-left: -18px;}
.sp-selector-4, .button-label-4 {margin-left: 18px;}
.sp-selector-5, .button-label-5 {margin-left: 36px;}
.sp-arrow { position: absolute; top: 50%; width: 28px; height: 38px; margin-top: -19px; display: none; opacity: 0.8; cursor: pointer; z-index: 1000; background: transparent url(http://tympanus.net/Tutorials/CSS3FluidParallaxSlideshow/images/arrows.png) no-repeat; transition: opacity linear 0.3s; }
.sp-arrow:hover{ opacity: 1;}
.sp-arrow:active{ margin-top: -18px; }
.sp-selector-1:checked ~ .sp-arrow.sp-a2, .sp-selector-2:checked ~ .sp-arrow.sp-a3, .sp-selector-3:checked ~ .sp-arrow.sp-a4, .sp-selector-4:checked ~ .sp-arrow.sp-a5 { right: 15px; display: block; background-position: top right; }
.sp-selector-2:checked ~ .sp-arrow.sp-a1, .sp-selector-3:checked ~ .sp-arrow.sp-a2, .sp-selector-4:checked ~ .sp-arrow.sp-a3, .sp-selector-5:checked ~ .sp-arrow.sp-a4 { left: 15px; display: block; background-position: top left;}
.sp-slideshow input:checked ~ .sp-content { transition: background-position linear 0.6s, background-color linear 0.8s;}
.sp-slideshow input:checked ~ .sp-content .sp-parallax-bg { transition: background-position linear 0.7s;}
input.sp-selector-1:checked ~ .sp-content { background-position: 0 0;  }
input.sp-selector-2:checked ~ .sp-content { background-position: -100px 0; }
input.sp-selector-3:checked ~ .sp-content { background-position: -200px 0; }
input.sp-selector-4:checked ~ .sp-content { background-position: -300px 0;}
input.sp-selector-5:checked ~ .sp-content { background-position: -400px 0;}
input.sp-selector-1:checked ~ .sp-content .sp-parallax-bg {  background-position: 0 0;}
input.sp-selector-2:checked ~ .sp-content .sp-parallax-bg { background-position: -200px 0;}
input.sp-selector-3:checked ~ .sp-content .sp-parallax-bg { background-position: -400px 0;}
input.sp-selector-4:checked ~ .sp-content .sp-parallax-bg { background-position: -600px 0;}
input.sp-selector-5:checked ~ .sp-content .sp-parallax-bg { background-position: -800px 0;}
.sp-slider { position: relative; left: 0; width: 500%; height: 100%; list-style: none; margin: 0; padding: 0; transition: left ease-in 0.8s; }
.sp-slider > li { color: #fff; width: 20%; box-sizing: border-box; height: 100%; padding: 0 60px; float: left; text-align: center; opacity: 0.4; transition: opacity ease-in 0.4s 0.8s; }
.sp-slider > li img{ box-sizing: border-box; display: block; margin: 0 auto;max-height: 100%; max-width: 100%;}
input.sp-selector-1:checked ~ .sp-content .sp-slider {left: 0;}
input.sp-selector-2:checked ~ .sp-content .sp-slider {left: -100%;}
input.sp-selector-3:checked ~ .sp-content .sp-slider {left: -200%;}
input.sp-selector-4:checked ~ .sp-content .sp-slider {left: -300%;}
input.sp-selector-5:checked ~ .sp-content .sp-slider {left: -400%;}
input.sp-selector-1:checked ~ .sp-content .sp-slider > li:first-child, input.sp-selector-2:checked ~ .sp-content .sp-slider > li:nth-child(2), input.sp-selector-3:checked ~ .sp-content .sp-slider > li:nth-child(3), input.sp-selector-4:checked ~ .sp-content .sp-slider > li:nth-child(4), input.sp-selector-5:checked ~ .sp-content .sp-slider > li:nth-child(5){  opacity: 1;}



</style>

Je vous remercie

Kiraxa
avatar

Kiraxa
**

Féminin
Messages : 61
Inscrit(e) le : 09/07/2014

http://pensionnatwonderland.forumactif.org/
Kiraxa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Enlever le fond blanc de la PA

Message par Kiraxa le Mer 14 Aoû 2019 - 9:39

je up, merci Sad
avatar

Kiraxa
**

Féminin
Messages : 61
Inscrit(e) le : 09/07/2014

http://pensionnatwonderland.forumactif.org/
Kiraxa a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Enlever le fond blanc de la PA

Message par Milouze14 le Ven 16 Aoû 2019 - 5:37

Hello Kiraxa,
il faut juste donner la même couleur de fond au bloc de la P.A en ajoutant une class "Background" à la table et à deux cellules.

Dans le template index_body:
Affichage/Templates/Général/index_body

Recherches ceci :
Code:

<!-- BEGIN message_admin_index -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
   <!-- BEGIN message_admin_titre -->
   <tr>
      <td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
   </tr>
   <!-- END message_admin_titre -->
   <!-- BEGIN message_admin_txt -->
   <tr>
      <td class="row1" rowspan="3" align="center" valign="middle">
      <div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
      </td>
   </tr>
   <!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->



Supprimes et remplaces par:

Code:

<!-- BEGIN message_admin_index -->
<table class="forumline Background" width="100%" border="0" cellspacing="1" cellpadding="0">
   <!-- BEGIN message_admin_titre -->
   <tr>
      <td class="catHead Background" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
   </tr>
   <!-- END message_admin_titre -->
   <!-- BEGIN message_admin_txt -->
   <tr>
      <td class="row1 Background" rowspan="3" align="center" valign="middle">
      <div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
      </td>
   </tr>
   <!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->



Penses a enregistrer puis à valider en cliquant respectivement sur :enreg: puis Enlever le fond blanc de la PA 824052533





Puis dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:

.Background{background-color:#19152e !important;}

Penses à cliquer sur le bouton Enlever le fond blanc de la PA Sans_t10


Et voilou Very Happy .

a++
Milouze14

Milouze14
Membre actif

Masculin
Messages : 5706
Inscrit(e) le : 18/04/2005

https://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Enlever le fond blanc de la PA

Message par Chacha le Mar 20 Aoû 2019 - 9:35

Enlever le fond blanc de la PA UmaslZ4Bonjour,

Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 60390
Inscrit(e) le : 21/08/2010

https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Enlever le fond blanc de la PA

Message par Chacha Hier à 9:38

Enlever le fond blanc de la PA 8djze9qBonjour,

Nous n'avons plus de nouvelle de l'auteur de ce sujet depuis plus de 7 jours. Nous considérons donc ce problème comme résolu ou abandonné. La prochaine fois, merci de nous tenir au courant de l'évolution de votre problème, ou pensez à faire un UP régulièrement !

Ce sujet est archivé afin de ne pas perdre les réponses apportées.
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 60390
Inscrit(e) le : 21/08/2010

https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum