Problème affichage PA

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

Résolu Problème affichage PA

Message par Solid6Snake le Lun 4 Jan 2016 - 21:12

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Plusieurs utilisateurs
Lien du forum : http://www.entraide-youtubers.com/

Description du problème

Bonsoir, je viens vous voir parce que je me trouve devant un nouveau problème sur l'affichage de ma page d'accueil.

Voilà quelques temps que j'ai demandé à un codeur de never-utopia (superbe site au passage) de me réaliser une page d'accueil en slide.

C'est choses faite aujourd'hui est tout fonctionne parfaitement sauf que pour certains utilisateurs il y à un décalage de flèche pour le coulissant du second module vidéos.



Vous voyez sur un grand écran les deux petites flèches se retrouvent en bas à gauche du cadre et ce n'est pas l'effet que je souhaite.

Le problème c'est que sur un petit écran (comme moi par exemple) tout est nickel alors je ne sais pas comment satisfaire tout le monde.

Si vous avez une solution je suis preneur Wink

Merci d'avance et bonne soirée.



Dernière édition par Solid6Snake le Mer 6 Jan 2016 - 11:18, édité 1 fois

Solid6Snake
****

Messages : 317
Inscrit(e) le : 07/11/2013

http://www.entraide-youtubers.com/
Solid6Snake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème affichage PA

Message par tupac le Mar 5 Jan 2016 - 17:11

Bonjour,

Votre code est-il placé dans un tableau et si c'est le cas lui avez-vous donné une largeur ?

tupac
+ Hyperactif +

Masculin
Messages : 2334
Inscrit(e) le : 13/10/2010

tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème affichage PA

Message par Solid6Snake le Mar 5 Jan 2016 - 20:20

Bonjour non mon code n'est pas dans un tableau.

Mon code:

Code:
<div class="pa_total">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                
   <div class="slide_bloc" id="shidden">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
      <div class="slide">
                                                                                                                                                                                                                                                                                                           <object style="width:550px;height:350px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/8cz1kHp6DvI" type="text/html"></object><object style="width:550px;height:350px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/fV1nGsMEcjo" type="text/html"></object><object style="width:550px;height:350px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/q8nXQT8socA" type="text/html"></object>                                                                                                                                                                                                                                                                                                     
      </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           
   </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        
   <div class="selecteur">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     
   </div>
                                                                                                                                                                                                                                                                                                 <a style="position: absolute; right: 45px; font-size: 8px; margin-top: -14px; color: rgba(0,0,0,0.5); text-decoration: none!important;" href="http://www.never-utopia.com/">(c) Never-Utopia</a>                                                                                                                                                                                                                                                                                     
   <div class="slide_bloc" id="shidden2">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
      <div class="slide_content">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      
         <div class="slide">
                                                                                                                                                                                                                                                                                                                          <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/ldRQDA8_pN4" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/UzTDnVn83BM" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/87eOfYxHiBk" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/h1cMDcy0iKg" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/8cz1kHp6DvI" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/XcvlU5ySwH0" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/wEX9ClQqJXc" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/d6ugUtHN31w" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/_FuMvu4f21I" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/cFRD9pRRHgM" type="text/html"></object>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     
         </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  
      </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           
   </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        
   <div class="selecteur">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     
   </div>
                                                        
   <div class="fleches">
                                                                                                                                                                                                                                                                    <img class="fleche gauche cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche13.png" />        <img class="fleche droite cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche12.png" />                                                                                                                                                                                                                                                       
   </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  
</div>
<div class="selecteur">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  
</div>
                                                                                                                                                                                                                                                            <a style="position: absolute; right: 45px; font-size: 8px; margin-top: -14px; color: rgba(0,0,0,0.5); text-decoration: none!important;" href="http://www.never-utopia.com/">(c) Never-Utopia</a>                                                                                                                                                                                                                                                     
<div class="slide_bloc" id="shidden2">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            
   <div class="slide_content">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   
      <div class="slide">
                                                                                                                                                                                                                                                                                                                       <object type="text/html" data="https://www.youtube.com/embed/btV3H4NnuyY" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object><object type="text/html" data="https://www.youtube.com/embed/fV1nGsMEcjo" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object><object type="text/html" data="https://www.youtube.com/embed/db5s0OJXqLg" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object><object type="text/html" data="https://www.youtube.com/embed/ZkHvcFwx26I" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object><object type="text/html" data="https://www.youtube.com/embed/R7heIrwvypY" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object><object type="text/html" data="https://www.youtube.com/embed/lEq93PC6WFw" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object><object type="text/html" data="https://www.youtube.com/embed/JzH0qGcTwh4" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/VWdC8ojcPvY" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/E6fla3qMJT8" type="text/html"></object><object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/JzH0qGcTwh4" type="text/html"></object>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     
      </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
   </div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                
</div>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             
<div class="selecteur">
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              
</div>
<div class="fleches">
                                                                                                                                                                                                                                                                 <img class="fleche gauche cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche13.png" />        <img class="fleche droite cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche12.png" />                                                                                                                                                                                                                                                   
</div>

Ce qui pose problème c'est le dernier morceau de code:

Code:
<div class="fleches">
                                                                                                                                                                                                                                                                 <img class="fleche gauche cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche13.png" />        <img class="fleche droite cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche12.png" />                                                                                                                                                                                                                                                   
</div>

Après ça fonctionne sur les petits écran j'y comprend pas grand chose.. c'est certinement un problème de code.

Solid6Snake
****

Messages : 317
Inscrit(e) le : 07/11/2013

http://www.entraide-youtubers.com/
Solid6Snake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème affichage PA

Message par tupac le Mer 6 Jan 2016 - 1:04

RE !

Voila je pense que ça devrait aller comme ceci, J'ai intégré votre code dans un tableau et lui ai défini une hauteur et largeur ça permet aux flèches de bien s’aligner à gauche par rapport a la première vidéo.

Remplacer votre code HTML par celui-la.


Code:
<table style="height: 350px;">
                    
   <tbody>
                       
      <tr>
                          
         <td>
             
            <div class="pa_total">
                                
               <div class="slide_bloc" id="shidden">
                                   
                  <div class="slide">
                                                                                                                   <object style="width:550px;height:350px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/8cz1kHp6DvI" type="text/html"></object><object style="width:550px;height:350px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/fV1nGsMEcjo" type="text/html"></object><object style="width:550px;height:350px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/q8nXQT8socA" type="text/html"></object>                                                                                                                                                                                                                 
                  </div>
                                   
               </div>
                                  
               <div class="selecteur">
                                   
               </div>
                                                                                                                                 <a style="position: absolute; right: 45px; font-size: 8px; margin-top: -14px; color: rgba(0,0,0,0.5); text-decoration: none!important;" href="http://www.never-utopia.com/">(c) Never-Utopia</a>   
            </div>
             
         </td>
          
      </tr>
       
   </tbody>
</table>
             
<table style=" width: 1100px;height: 130px;">
                    
   <tbody>
                       
      <tr>
                          
         <td>
                                                                                                                                         
            <div class="slide_bloc" id="shidden2">
                                
               <div class="slide_content">
                                   
                  <div class="slide">
                                                                                                           <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/ldRQDA8_pN4" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/UzTDnVn83BM" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/87eOfYxHiBk" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/h1cMDcy0iKg" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/8cz1kHp6DvI" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/XcvlU5ySwH0" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/wEX9ClQqJXc" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/d6ugUtHN31w" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/_FuMvu4f21I" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/cFRD9pRRHgM" type="text/html"></object>                                                                                                                                                                                                                 
                  </div>
                                                                                                                         
               </div>
                                                                                                                              
            </div>
                                                                                                                                   
            <div class="selecteur">
                                
            </div>
                                                                                           
            <div class="fleches">
                                                                                                                     <img class="fleche gauche cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche13.png" />        <img class="fleche droite cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche12.png" />                                                                                                                                                                                                                           
            </div>
                                                                   
            <div class="selecteur">
                                                                      
            </div>
                                                                                                                                <a style="position: absolute; right: 45px; font-size: 8px; margin-top: -14px; color: rgba(0,0,0,0.5); text-decoration: none!important;" href="http://www.never-utopia.com/">(c) Never-Utopia</a>                                                                                                     
         </td>
                          
      </tr>
                       
   </tbody>
                    
</table>
             
<table style=" width: 1100px;height: 130px;">
                    
   <tbody>
                       
      <tr>
                          
         <td>
                                                                         
            <div class="slide_bloc" id="shidden2">
                                
               <div class="slide_content">
                                   
                  <div class="slide">
                                                                                                                   <object type="text/html" data="https://www.youtube.com/embed/btV3H4NnuyY" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object> <object type="text/html" data="https://www.youtube.com/embed/fV1nGsMEcjo" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object> <object type="text/html" data="https://www.youtube.com/embed/db5s0OJXqLg" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object> <object type="text/html" data="https://www.youtube.com/embed/ZkHvcFwx26I" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object> <object type="text/html" data="https://www.youtube.com/embed/R7heIrwvypY" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object> <object type="text/html" data="https://www.youtube.com/embed/lEq93PC6WFw" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object> <object type="text/html" data="https://www.youtube.com/embed/JzH0qGcTwh4" style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/VWdC8ojcPvY" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/E6fla3qMJT8" type="text/html"></object> <object style="width:300px;height:175px;margin-top:0px; margin-left: 0px; border: 3px solid rgb(202, 202, 202);" data="https://www.youtube.com/embed/JzH0qGcTwh4" type="text/html"></object>                                                                                                                                                                                                                 
                  </div>
                                   
               </div>
                                                                                  
            </div>
                                                                                                               
            <div class="selecteur">
                                                                                                            
            </div>
                             
            <div class="fleches">
                                                                                                                             <img class="fleche gauche cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche13.png" />        <img class="fleche droite cliquable" src="http://i21.servimg.com/u/f21/17/84/80/30/fleche12.png" />                                                                                                                                               
            </div>
                                                         
         </td>
                          
      </tr>
                       
   </tbody>
                    
</table>

tupac
+ Hyperactif +

Masculin
Messages : 2334
Inscrit(e) le : 13/10/2010

tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème affichage PA

Message par Solid6Snake le Mer 6 Jan 2016 - 8:05

J'ai placé votre nouveau code sur ma PA de forum test ça semble bien sauf que j'ai un trop gros espace entre le gros module et les deux petits du dessous c'est normal? C'est modifiable?

http://testentraideyoutube.forumactif.org/

Solid6Snake
****

Messages : 317
Inscrit(e) le : 07/11/2013

http://www.entraide-youtubers.com/
Solid6Snake a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème affichage PA

Message par tupac le Mer 6 Jan 2016 - 9:09

Bonjour,

Ce sont deux tableaux placé l'un sur l’autre il ne devrait pas y avoir un tel d'écart et je ne l'ai pas chez moi, avez-vous essayé de le placer sur le bon forum ?

tupac
+ Hyperactif +

Masculin
Messages : 2334
Inscrit(e) le : 13/10/2010

tupac a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème affichage PA

Message par Solid6Snake le Mer 6 Jan 2016 - 11:02

Après vérification c'est bon oui il n'y à plus d'écart sur les grands écrans mais sur les petits oui mais c'est normal donc c'est parfait !

1000 fois merci de m'avoir aide c'est vraiment sympa de votre part Yes


Solid6Snake
****

Messages : 317
Inscrit(e) le : 07/11/2013

http://www.entraide-youtubers.com/
Solid6Snake 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