28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

J'ai un souci. J'ai un bloc div qui a une hauteur dynamique.
Voici le code HTML :
<li class="files">Attachments 
  <span class="list">
   <a class="btnaudio" href=""></a>
   <a class="btnphoto" href=""></a>
   <a class="btnvideo" href=""></a>   
  </span><br />
  <div id="photo_part">
    <p>Photos</p>
    <div class="photos_box">
      <img src="images/image1.png" alt="" />
      <img src="images/image2.png" alt="" />
    </div>
    <div class="photos_box">
      <img src="images/image3.png" alt="" />
      <img src="images/image4.png" alt="" />
    </div>
  </div>
  <div id="audio_part">
    <p>Audio</p>
  </div>
  <div id="video_part">
    <p>Video</p>
  </div>
</li>


Pour ce qui est des blocs "photos_box", il peut y en avoir un nombre illimité.
De plus, les blocs "photo_part", "audio_part", et "video_part" peuvent ne pas être visibles.
La hauteur de mon li est de minimum 50px, mais il n'y a pas de maximum.
J'ai essayé de mettre à mon li "min-height="50px" mais ça a n'a pas l'air d'être pris en compte, ma height se met à 50px alors que dans l'exemple précédent elle devrait être de bien plus.

Avez-vous une idée ?

Merci.
Modifié par Yuuko (21 Nov 2012 - 10:25)
rodolpheb a écrit :
Je n'arrive pas à saisir ton problème, peux-tu être plus explicite.


Par défaut, la hauteur de mon li est de 50px.
Le problème, c'est que ce li peut faire une hauteur supérieure à 50px, en fonction du contenu qui varie.
J'ai donc mis min-height: 50px, et pourtant, mon li reste à 50px au lieu de faire + (étant donné que le contenu à l'intérieur est assez conséquent dans cet exemple).
Peux-tu me montrer ce que tu as en CSS, car j'ai essayé en prenant en compte tes paramètres et ça fonctionne; alors je me dis qu'il doit y avoir autre chose, et je ne voudrais par répondre à côté!! Smiley smile
En fait, je viens de m'apercevoir que le problème vient des "li".
J'ai testé en mettant un "div" à la place du "li" et je n'ai pas de problème.

Quelqu'un sait de quoi ça vient ?
Div est élément block et li un élément inline, tu peux essayer avec tes li d'origine avec display=inline-block
Modifié par rodolpheb (21 Nov 2012 - 17:43)