28173 sujets

CSS et mise en forme, CSS3

Pages :
(reprise du message précédent)

Chez moi ca réagit bien même si je n'ai pas toutes les images car je fixe la taille (width) de mon div.vignette

Si je ne la fixe pas, le texte fait prendre toute la largeur et il n'y a qu'un élément par ligne. (Rq - je viens d'essayer- on peut fixer la largeur du texte, ça marche aussi).
a écrit :
Et donc ca va a la ligne s'il y'en a trop ?


oui, tu peux le voir ici

a écrit :
Merci de tes indications !!!


De rien, pour une fois que c'est moi qui apporte une piste/solution Smiley biggrin

Tiens nous au courant.

pour ma part, même si ça marche, je suis curieuse et je vais chercher à savoir pourquoi ça marche Smiley lol
Bon j'ai testé rapidement ca a l'air de bien fonctionner mais y'a pas de doutes pour que ca marche bien, il faut tout fixer, y compris la hauteur du titre et du texte, sinon ça part en live Smiley eek
Je sais pas si l'attribut "auto" pour la hauteur du titre et du texte pourrait fonctionner, faudra que j'essaye !
EDIT : apparemment non Smiley decu Smiley cligne
Modifié par Coding_machine (06 Oct 2006 - 10:01)
Aaaarghhhh!
finalement la nuit ayant porté conseil j'ai moi aussi refais des essais en modifiant l'ordre de mes "vignettes" et ça ne marche pas, c'était un coup de bol hier car ça "coupait" après la plus haute ....

Désolée pour la fausse joie. Je vais tout reprendre du début et essayer de comprendre comment marche le float:left, pourquoi le div englobant n'a pas la bonne taille ... Peut-être d'autres fils pour avoir des réponses
Smiley smile

Lundi je suis en RTT et s'il pleut je sais ce que je vais faire Smiley lol
Bon moi je considère qu'en fixant uniquement la hauteur du bloc dl gallery (dans la source d'origine que tu m'as donné en lien), ca fonctionne. Mais il ne faut pas que le texte soit plus grand, car le bloc n'est pas agrandi pour autant. Mais c'est pas un probleme vu que ce serait moche d'avoir des blocs de hauteur différente, je trouve, dans une gallerie d'image. C'est vrai qu'en fixant la taille des images bah ca va .... Faudra controler la taille du texte quoi !
Après j'ai un problème de centrage, c'est a dire que tous les blocs sont eux-mêmes contenus dans un voire deux div englobants, alors sous Internet Explorer ils sont centrés (même marge à gauche de la ligne d'images qu'a droite), mais pas sous Firefox, ou la ligne d'images est à alignée à gauche ...
Enfin déséspère pas on va y arriver Smiley biggrin
Modifié par Coding_machine (06 Oct 2006 - 18:26)
Je ne désepère pas, je débute et comme j'aime bien fouiller pour résoudre des problèmes, en fait je m'amuse Smiley lol
Merci Keran pour le lien, je n'ai pas regardé le PHP car c'est pour moi encore une inconnue (XML, XSLT, XHTML et CSS me suffisent Smiley smile mais s'il faut s'y mettre ...).

Sais tu s'il gère des textes plus grand que ce qu'il y a dans la démo car pour ce que j'ai vu dans sa CSS, il ne fixe ni la largeur ni la hauteur des vignettes. En reprenant le HTML généré et en modifiant le texte, l'affichage est perturbé par l'élargissement des vignettes.

La solution est-elle dans le PHP?

Encore merci.
<gbadji

a écrit :
La solution est-elle dans le PHP?


pour une galerie, je n'ai pas trouver mieux et de loin.en fait, les codes sont de moi, les dimensions des divs sont bien fixées par la css, regarde mieux.

.pay img {
width: 210px;
height: 90px;
margin: 60px 0;
}
.port img {
width: 90px;
height: 210px;
margin: 0 60px;
}


je vais tenir compte de cette remarque pour une prochaine maj.en fait, j'y avais déjà penser mais abandonner pour me concentrer sur le php et xhtml généré.j'y retourne.

ps : php, çà vous change la vie...à condition de ne pas l'apprendre ailleurs que dans des livres...et sur php.net pour la syntaxe et les règles de sécurité.
Modifié par keran (07 Oct 2006 - 23:01)
a écrit :
pour une galerie, je n'ai pas trouver mieux et de loin.en fait, les codes sont de moi, les dimensions des divs sont bien fixées par la css, regarde mieux.


tu fixes éffectivement la taille des images, mais si tu mets un texte plus grand,

<div class="miniature pay">
<a href="http://www.guitweb.com/page4/photos/musiciens/cuivres/charlie_parker.jpg" rel="lightbox" title="charlie parker"><img src="index.php_fichiers/charlie_parker.jpg" height="90" width="210"></a>
<ul><li>charlie parker, 640 x 632</li></ul>
<ul><li><a href="http://www.guitweb.com/page4/index.php?ajout=photos/musiciens/cuivres/charlie_parker.jpg&dossier=musiciens&sdossier=cuivres&debut=0" title="ajout de charlie parker au panier">ajoutez au panieaajoutez au panierajoutez au panierajoutez au panierjoutez au panierajoutez au panierrajoutez au panier</a></li></ul>



la largeur est modifiée. et si tu fixe la largeur:


.miniature {
background-color: #DFDFDF; 
float: left;
border: 1px solid #999;
padding: 15px 5px;
margin: 5px 4px;
text-align: center;
[b]width:210px;[/b]
}



la mise en page est bouleversée Smiley ohwell
Peut-être qu'en PHP, on peut arriver à déterminer la hauter pour la fixer pour tout le monde. C'est toi l'expert Smiley lol .

En tout cas encore merci.
salut

php ne peut rien pour influer sur les css.son role c'est l'écriture automatique du html nécessaire(mais aussi des js, des css...), le redimensionnement des images, les tests de liens, leur écriture automatique en fonction des demandes...ect.la seule hauteur que php peut déterminer c'est celle des images, pas du bloc.avec php, tu places simplement les images dans des dossiers et il s'ocuppe du reste.comme tu t'intérésses au xml, jette un œïl sur la prise en charge du language par php, simplexml est tout simplement génial.çà me donne d'ailleurs une idée pour les galeries.un fichier xml pourrait être écrit dynamiquement en fonction des images affichées, il contiendrait ce qui ne peux être placé dans le div.

pour ce qui nous préocuppes c'est sur les css qu'il faut agir.mais comme l'intéret de ce type de mise en place flottante est de s'adapter au contenu, il faut faire en sorte que les noms de fichiers ne soit pas trop long pour le div conteneur.c'est contraignant mais c'est la seule solution que j'ai trouver en dehors des tableaux.même éric meyer dans son bouquin "css 2", n'à pas de solution et suggère les tableaux.j'ai supprimer le inline des listes, mais ce n'est pas la solution, l'imbrication des divs non plus.

une solution serait d'ajouter un script ou code css qui ferait apparaitre une info-bulle contenant les commentaires supplémentaires.php peut aussi lire un fichier texte associé à chaque image et l'afficher en dehors du flux en écrivant le css approprié.je retourne tester.je pense aussi au title des liens.

si tu trouves une solution, fait moi signe.de mon côté, si je trouve quelque chose d'intélligent, je posterais içi.

a écrit :
C'est toi l'expert


ironie?
a écrit :
ironie?


dans la mesure ou tu en connais plus que moi je peux dire que tu es un expert Smiley cligne

pour simplexml, je vais regarder ce que c'est. Merci.

Coding_machine, j'ai un peu squaté ton fil. Désolée.
Modifié par gbadji (08 Oct 2006 - 17:42)
Moi au final je me pose la question de savoir si j'utilise les tableaux ou pas ...
Je pense que je vais choisir les div image plutôt, en fixant la hauteur des images et la hauteur du bloc qui contient les images et le texte. Quoique si un pro suggère les tableaux, remarque, ca mérite reflexion !!!
salut

a écrit :
Quoique si un pro suggère les tableaux, remarque, ca mérite reflexion !!!


hô que oui! et d'ailleurs je m'y met de suite, pour voir.
Finalement j'ai opté pour la solution CSS bien que n'ayant pas résolu les problèmes énoncés plus haut.

Je développe tout en fonction du référencement, je fais mon site en CSS de type content-first (les div contenant le contenu (c'est clair lol) en premier dans le source). Ce qui ne m'empecherait aucunement de placer des tabs dans un div, on est d'accord (c'est d'ailleurs ce que j'avai fait avant de chercher la soluce en full-css).

Je pense qu'a la longue les données contenues dans tes tabs seront moins bien indéxées par les moteurs mais pour l'instant je suis d'avis que ca n'a pas d'influence...
Pages :