Alignement vertical sans table

Question

J'ai un champ de 3 colonnes, les 2 premières colonnes correspondent à la description et la dernière colonne correspond à l'image. Est-il possible d'aligner verticalement la description en fonction de la hauteur de l'image. Je n'ai pas pu spécifier la hauteur de la ligne car la hauteur de l'image varie. Actuellement, si j'utilise la table, il n'y a pas de problème. Mais ce que je veux, c'est utiliser div ou li.

Toute suggestion serait grandement appréciée. Merci d'avance.

Answer 1

Un peu de javascript vous permet de trier ici, pour placer les DIVs sur une ligne à des hauteurs égales. Il y a un plugin Jquery pour vous aider ici:

http://www.cssnewbie.com/equalheights-jquery-plugin/

Answer 2

vertical centrage sans tables est délicate, mais il es quelques solutions de contournement, voir si vous pouvez les utiliser:

http://www.student.oulu.fi/~laurirai/www/css/middle/ http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

Answer 3

Je pense que vous pouvez utiliser des codes javascript dans la fonction $(document).ready() pour ce d'abord vous devez utiliser ID pour tous vos éléments (2 div diviseurs et un div image). après cela, vous pouvez écrire du code javascript pour obtenir l'image par ID et récupérer son attribut width puis définissez cette valeur pour la largeur des deux votre description divs il y a un exemple HTML:

<div id="desc1"><!-- some content --></div> 
<div id="desc2"><!-- some content --></div> 
<div id="image"><!-- some image --></div> 

javascript doit être quelque chose comme ceci:

$(document).ready(function(){ 
    var width = $('#image')[0].attribute['width']; 
    $('#desc1')[0].setAttribute('width',width); 
    $('#desc2')[0].setAttribute('width',width); 
}); 

par la façon, vous pouvez utiliser un nom spécial et égal pour les deux divs description et les récupérer en appelant $(document).getElementsByName('some_name') méthode, puis utiliser une boucle. puisque vous avez juste deux divs pour travailler avec, il ne change pas dans la performance

bonne chance;)