28173 sujets

CSS et mise en forme, CSS3

bonjour
presentation visuelle du probleme:

upload/3501-Sanstitre.JPG

(sous ie parce qu'evidemment le probleme est sous ie...)

donc en fait jai une div 'art' qui contient un logo(en float), du texte, j'ai ainsi plusieurs div de ce type, pour eviter que mes logos ne depassent j'ai mis un overflow hidden a cette div.
la div jaune 'pub', est en float right.
ms apparement ie reagit bizarrement a cà et m'agrandit ma div art pour y mettre la div logo...

code html:
<div class="conteneur">
	<div class="pub">
	</div>
	
	<div class="art">
	<h3>titre</h3>
	<div class="image">image...</div>
	<p> texte</p>
	</div>
	
	<div class="art">
	<h3>titre</h3>
	<div class="image">image...</div>
	<p> texte</p>
	</div>
</div>


et le css

.conteneur{{
margin-top:20px;
width:100%;
padding-bottom:10px;
}

.art{
overflow:hidden;
}

.image
{
float:left;
margin:5px;
}


voilà voilà... c'est pas grand chose je pense mais il me manque lastuce...
Smiley biggrin
Modifié par akapando (06 Jul 2006 - 13:23)
Salut,

a écrit :
pour eviter que mes logos ne depassent jai mis un overflow hidden a cette div.


tu veux dire qu'il sortent de leurs conteneurs ?
A moins que je me trompe, c'est pas un overflow qu'il te faut mais plutot un spacer invisible avec la propriété clear:both par exemple.


Attention à ça :
conteneur[b]{{[/b]


tu peux allèger ça :

<div class="image">image...</div>


Comme ça :
<img class="image" src="" alt=""/>


...ton code ne correspond pas au visuel...
Sa construction est lourde.
en general tout ce qui concerne l'overflow requiert une definition du width ou du height , ce que tu n'as pas fait
bah en fait c'est du code copier coller d'ou le double {
le code est allegé aussi...
maiss grosso modo le rendu a limage ressemble a ce que jai fait...

oui jai bien essayé avec le hr clear both mais dans ce cas la div art passe en dessous de ma div
ce qui ne marrange pas
moi je voudrai mes divs art qui sagencent bien et ma div pub qui se mets en haut sur le coté droit...

bah disons que mes divs art ont des hauteurs pas specifiques cest vraiment selon ce quil y a dedans..pour la largeur pareil...
Modifié par akapando (06 Jul 2006 - 13:21)
bah c'etait un test autre que le hr clear both qui m'aide pas plus...
mais bon ni l'un ni lautre ne marchent alors bon...

enfin si ca marche mais pas comme je veux.
ms si t'a une idee je suis preneuse
Modifié par akapando (06 Jul 2006 - 13:22)
Administrateur
Bonjour,

Merci de respecter les Conventions d'écriture de ce Forum et de bannir l'utilisation du langage SMS (ms, k, c , et absence d'apostrophe entre autres), cela rend la lecture très diificile à ceux qui essaient de vous aider Smiley cligne

Felipe
Modifié par Felipe (06 Jul 2006 - 13:20)
Hum a écrit :
A moins que je me trompe, c'est pas un overflow qu'il te faut mais plutot un spacer invisible avec la propriété clear:both par exemple.

Tu te trompes, car si le spacer invisible est une solution, utiliser la propriété overflow en est une autre, qui ne demande pas d'avoir recours à un élément rajouté dans le code HTML.

jp94 a écrit :
en general tout ce qui concerne l'overflow requiert une definition du width ou du height , ce que tu n'as pas fait
(…)
Comment tu pretends faire un overflow si ton conteneur s'adapte au contenu ?

Est-ce que akapando veut vraiement « faire un overflow » ? Je ne suis pas sûr d'avoir compris sa demande.
En tout cas, la propriété overflow ne sert pas uniquement à limiter une boîte à une dimmension donnée. Cf mon commentaire ci-dessus.
non je veux juste utiliser leffet que me rend loverflow , en fait grace à cà sous firefox du moins ca me permet de faire en sorte que ma div art contienne bien toute la div image, donc pas d'effet en "escalier"..
je l'utilise juste a cette fin là.

en fait loverflow hidden qui regle mon problème sous firefox me le regle pas sous ie c'est mon problème en fait.
akapando a écrit :
pour eviter que mes logos ne depassent j'ai mis un overflow hidden a cette div.
(…)
ms apparement ie reagit bizarrement a cà et m'agrandit ma div art pour y mettre la div logo...

Heu… n'est-ce pas justement la raison pour laquelle tu as utilisé la propriété overflow ? Pour que les logos ne dépassent pas de leur bloc parent ?
Où est le problème alors si Internet Explorer ne fait pas dépasser les logos ? N'est-ce pas le comportement voulu ?

Je comprends pas trop là.

Tu nous aurais dit que le overflow: hidden ne marche pas avec Internet Explorer (pour obtenir le même comportement, il faut doter l'élément parent de layout), j'aurais compris, mais là je suis perdu. Smiley sweatdrop


EDIT :
a écrit :
en fait loverflow hidden qui regle mon problème sous firefox me le regle pas sous ie c'est mon problème en fait.

Ah ben voilà, je comprends mieux alors. Pour trouver la solution, cf le lien juste au dessus. Smiley cligne
Modifié par mpop (06 Jul 2006 - 14:40)
sisi jai pas du etre claire lol

IE n'agit pas comme je voudrai, et l'overflow semble inexistant en effet...

l'element layout je le mets donc a quel niveau? dans ma div art? ou la div conteneur?
bon jai reussi (enfin)
jai donc modifié ma div art ainsi

.art{
overflow:hidden !important;
overflow:none;
height:auto !important;
height:1%;
}

et oh miracle ca marche Smiley lol

merci beaucoup Smiley cligne