Forum Programmation.web Flottant sur une liste ul

Posté par  (site web personnel) .
Étiquettes :
0
11
mai
2005
Bonjour à tous.

Je patauge en CSS, et je voudrais savoir qui fait le bon rendu. Si l'on en croit la norme [1], Gecko est dans son tort (IE et KHTML sont ok).

Si l'on a une liste avec de longues lignes li, et un flottant par dessus, et bien toute les li qui sont au niveau du flottant ne s'écoulent pas sous le flottant. J'explique mal.

Donc [3] et [4] vous donne les rendus Gecko et IE (pas KHTML sous la main, désolé, mais je sais qu'il a le même comportement qu'IE).

Pour le source de la démo, voir [2].

Qui a raison?

(le bugzilla ne donne rien)

[1] http://www.w3.org/TR/REC-CSS2/visuren.html(...)
[2] http://www.sousmonlit.dyndns.org/~niol/tmp/flow_on_li.html(...)
[3] http://www.sousmonlit.dyndns.org/~niol/tmp/li_flow_firefox.png(...)
[4] http://www.sousmonlit.dyndns.org/~niol/tmp/li_flow_ie.png(...)

NB : Je parle de Gecko Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.7.7) Gecko/20050421 Firefox/1.0.3 (Debian package 1.0.3-2) et de Mozilla/5.0 (Windows; U; Windows NT 5.0; fr-FR; rv:1.7.7) Gecko/20050414 Firefox/1.0.3
  • # Mes essais

    Posté par  . Évalué à 4.

    Effectivement je pencherais pour un bug de gecko... ou alors c'est un choix des développeurs, peut etre que ce n'est pas spécifié. En fait j'ai trouvé le moyen de faire ce que tu souhaiterais de la manière suivante :

    [...]
    <style type="text/css" media="screen">
    #container { width:400px; color:white; background-color:green; }
    .main { }
    .floating { float:right; width:200px; background-color:blue; margin:5px; }
    .item {display:list-item;}
    #bloc1 {padding-left:1.5em }
    </style>

    [...]
    <div id="bloc1">
    <div class="item">Hi, I am a list with very very long <code>li</code> elements. I can be the contents of a news log, or I don't know, anything else. A list of really long elements. This is really a matter of choice. Some weblogs use a list to let posts flow, and some others use <code>div</code>s. Perhaps it is a bad idea anyway to use a list.</div>
    <div class="item">And I am the next post. I have no problem at all to flow below the float.</div>
    </div>
    [...]

    Et ca ca rend pareil sous IE et FF. En fait j'ai remplacé le <ul> par un <div> avec le padding qu'il faut et le <li> par un <div> avec le display 'liste'. On pourrait s'attendre à voir le meme comportement qu'avant, et pourtant là ca marche. Peut etre qu'il y a une balise supplémentaire appliquée par défaut aux <ul> ou <li> qui dit qu'il ne faut pas déborder... Je n'ai plus le temps de chercher, allez au taf !
    • [^] # Re: Mes essais

      Posté par  (site web personnel) . Évalué à 2.

      Merci beaucoup pour tes essais. En effet, il est possible de contourner le problème sans trop se casser la tête.

      Je voulais juste savoir, n'étant pas un gourou CSS, si il fallait plutot pencher pour un bug ou pour une feature.
  • # Bug ouvert

    Posté par  (site web personnel) . Évalué à 3.

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.