Bonjour à tous,
Après avoir tourné et retourné le problème dans tous les sens je me décide à poster mon problème.
Je souhaite aligner un certain nombre de blocs (#div) dans un container (section) avec un alignement horizontale (display:inline-block;). Cependant mes différents blocs n'ont pas le même contenu et de ce fait l'alignement n'est pas parfait malgré les dispositions que j'ai prises:
- (overflow:hidden;) et une protection contre les white-spaces (overflow: hidden;white-space: nowrap;) sur les blocs (div.fi_block) et white-space:normal; sur le texte.
Je souhaite savoir quelle est la meilleure façon d'aligner parfaitement des blocs avec un contenu différent avec les éléments alignés de manière précise dans le bloc lui même sans boulverser l'alignement. Le tout de manière compatible avec les navigateurs les plus récents.
Source pour débugger mon code (extrait de code) :
http://cdpn.io/oiyzB
original (compatible avec firefox mais problème d'alignement avec chrome):
*removed*
Notes: J'utilise le framework bootstrap avec font-awesome pour l'affichage d'icones sur les balises <i></i>. Mon projet n'a aucune vocation commerciale et est uniquement destiné à me faire progresser en php (récupération des cours du CAC40 avec insertion dans une BDD) et le front-end.
Je vous remercie pour votre aide, toutes les remarques sont bienvenus .
Modifié par pete (23 Aug 2013 - 15:47)
Après avoir tourné et retourné le problème dans tous les sens je me décide à poster mon problème.
Je souhaite aligner un certain nombre de blocs (#div) dans un container (section) avec un alignement horizontale (display:inline-block;). Cependant mes différents blocs n'ont pas le même contenu et de ce fait l'alignement n'est pas parfait malgré les dispositions que j'ai prises:
- (overflow:hidden;) et une protection contre les white-spaces (overflow: hidden;white-space: nowrap;) sur les blocs (div.fi_block) et white-space:normal; sur le texte.
Je souhaite savoir quelle est la meilleure façon d'aligner parfaitement des blocs avec un contenu différent avec les éléments alignés de manière précise dans le bloc lui même sans boulverser l'alignement. Le tout de manière compatible avec les navigateurs les plus récents.
Source pour débugger mon code (extrait de code) :
http://cdpn.io/oiyzB
original (compatible avec firefox mais problème d'alignement avec chrome):
*removed*
Notes: J'utilise le framework bootstrap avec font-awesome pour l'affichage d'icones sur les balises <i></i>. Mon projet n'a aucune vocation commerciale et est uniquement destiné à me faire progresser en php (récupération des cours du CAC40 avec insertion dans une BDD) et le front-end.
Je vous remercie pour votre aide, toutes les remarques sont bienvenus .
Modifié par pete (23 Aug 2013 - 15:47)