Problème avec les balises <div>

playboy-1990 Messages postés 593 Statut Membre -  
xamurai Messages postés 223 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,
J'ai un problème avec les balises <div>
Je voudrais savoir comment je peux mettre des images dans deux blocs <div> sans faire de retour à la ligne
Car chez moi chaque bloc <div> fait automatiquement un retour à la ligne similaire à la balise <br />
Merci

5 réponses

  1. telliak Messages postés 3652 Date d'inscription   Statut Membre Dernière intervention   885
     
    Re,
    A supposer que tes images tiennent dans la largeur donnée (410px), si tu ne définis aucune propriété aux div diapo1 et diapo2, par défaut ceux-ci se placent l'un au-dessous de l'autre.
    Tu peux consulter de la doc et un exemple de galerie à :
    www.w3schools.com/css/tryit.asp?filename=trycss_float_elements
    et une introduction au positionnement à :
    www.alsacreations.com/...
    1
  2. telliak Messages postés 3652 Date d'inscription   Statut Membre Dernière intervention   885
     
    Quelles sont les propriétés que tu mets dans tes div ? Donne un exemple, parce que là, le sujet est vaste.
    0
  3. playboy-1990 Messages postés 593 Statut Membre 273
     
    Voici un exemple :
    <style type="type/css">  
    .splashMainPic  
     {  
      position:relative;  
      display:block;  
      height:380px;  
      width:410px;  
     }  
     </style>  
     <script type="text/javascript">  
    $(document).ready(function() {  
        $('#diapo1').cycle({  
      fx: 'fade' 
     });  
    });  
    </script>  
     <script type="text/javascript">  
    $("#diapo2").cycle({  
        fx: "fade",  
        timeout: 300  
      });  
    </script>  
    
    <div class="splashMainPic">  
    <div id="diapo1">  
    <img alt="" src="img1.png" />   
    <img alt="" src="img2.png" />   
    <img alt="" src="img3.png" />   
    </div><div id="diapo2">  
    <img alt="" src="2img1.png" />   
    <img alt="" src="2img2.png" />   
    <img alt="" src="2img3.png" />   
    </div></div>  
    


    Et je voudrais que les deux blocs (diapo1 et diapo2 soient l'un à coté de l'autre
    Merci
    0
    1. arthezius Messages postés 3756 Statut Membre 475
       
      Tu peux essayer avec un float:left; dans le CSS.
      0
  4. xamurai Messages postés 223 Date d'inscription   Statut Membre Dernière intervention   15
     
    utilise float

    exemple :

    dans ton css ou dans ton head
    <style> 
    .div1 
    { 
       width : 400px; 
       height: 100px; 
    } 
    
    .div2 
    { 
       width : 200px; 
       height: 100px; 
       float: left; 
    } 
    
    .div3 
    { 
       width : 200px; 
       height: 100px; 
      float : left; 
    } 
    </style> 
    


    et dans ton body:

    <div class="div1"> 
       <div class="div2"><img  src="img1"></div> 
       <div class="div3"><img  src="img1"></div> 
    </div> 
    
    0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. Melooo Messages postés 1476 Statut Membre 84
     
    Bonjour,
    Essayes display:inline en css
    -2