27904 sujets

CSS et mise en forme, CSS3

Bonjour,

Je ne comprends pas pourquoi, mais ça fait une heure que je cherche sur Google et sur les fora, sans trouver ne serait-ce qu'un sujet qui parle de ce problème Smiley ohwell

Je cherche une solution pour positionner une image au milieu d'un bloc de texte, comme ceci :

upload/42495-en-tete.png

Bon, l'image n'est pas très concordante au niveau des alignements, mais j'ai fait ça vite fait pour montrer ce que je cherche à faire.

J'arrive (avec jQuery) à positionner l'image dans le div qui contient le texte et l'image, mais en position: absolute, donc, le texte passe par dessous au lieu de l'encadrer...

Quelqu'un aurait-il une solution ou une idée svp?

Merci d'avance Smiley cligne
Ce n'est "pas possible" en CSS.

Ou en tout cas, pas possible réellement en production (avec hack, technologies de dernière dernière techno CSS3). Mais surtout... Le web n'est pas du print, et un tel format n'est pas du tout utilisable sur notre medium.
Modifié par Vaxilart (22 Dec 2011 - 22:53)
Merci pour cette réponse rapide Smiley cligne

Bon du coup, je ne suis plus dans le bon forum...
Mais je pense qu'il est possible de "reconstruire" dynamiquement les éléments concernés, genre comme ça :

upload/42495-02.png

Mais là c'est plus jQuery qui m'aidera...

Vaxilart a écrit :
Mais surtout... Le web n'est pas du print, et un tel format n'est pas du tout utilisable sur notre medium.

Hélas, tout le monde n'est pas au courant, et vu comme jQuery, CSS, Flash et maintenant, HTML5 ont révolutionné le web chacun à sa façon, il est devenu courant de penser qu'on peut tout faire ou presque dans une page web...
Toute façon je n'aime pas le mot "impossible" Smiley biggrin

Merci encore pour ta réponse Vaxilart Smiley cligne
Modifié par nvwebconcept (22 Dec 2011 - 23:32)
Wow Smiley biggrin

Super usine ce truc!

Ben je vais me pencher là-dessus, car ça m'a l'air assez puissant. Ce serait dommage de passer à côté de ça...

Merci beaucoup pour cette info Smiley cligne
@Raphael: Je pensais justement à ça, d'où la présence des guillemets Smiley langue

C'est vraiment une proposition intéressante en tout cas; même si je dois encore y trouver une application pratique utile. Les exemples donné dans l'article me semble quand même de faible intérêt en production.
C'est vrai que à première vue, c'est un peu décourageant...
Mais je m'étais déjà penché sur Blueprint CSS pour essayer de construire des layouts, en pensant que ce système me permettrait de gagner du temps pour les suivants.

Puis j'en suis revenu, finalement, c'étaient trop de contraintes pour un gain de temps pas forcément évident... Je pense que Masonry est à peu près aussi lourd à utiliser qu'un framework CSS. Mais si ça vaut le coup, par exemple si c'est la seule solution à mon problème, je vais voir ça de plus près... Mais quand j'aurai digéré Smiley lol

Merci à Raphael pour l'info, je vais suivre ça également Smiley cligne