30

display:inline-block je connais pas, mais ça fait une éternité que j'ai pas touché au développement web, donc... Mais peut-être que Firefox a du mal aussi à cause de ça ?
(je connais display:inline, display:block etc, mais pas inline-block)

edit :
OK, vu ; c'est pas w3c, mais théoriquement c'est bien supporté quand même.

31

C'est CSS3, ça permet de récupérer le bordel infâme de la différence de conception des tailles de divs entre FF et IE (l'un prenant en compte la bordure dans la dimension totale, et l'autre non) : http://www.w3.org/TR/css3-box/#lsquo
avatar

32

Ah, OK, je me rappelle vaguement du problème, c'est à cause de ce genre de détail sordide que je suis content de ne plus faire de web grin

33

j'aurais dit la meme chose sur le inline-block, mais je prefere attendre de voir le code html genere grin (tu pouvais pas faire une ligne de code plus longue ? grin)
avatar
納 豆パワー!
I becamed a natto!!!1!one!

34

Voilà le code généré (anonymisé, mais j'ai vérifié, je reproduis le problème).

[nosmile]
<html>
	<head>
    	<title>Synchronisation</title>
 
    	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    	<script language="javascript">
    		var nexttobeprevious = 0;

	    	function displayInfo(uid, error, message, duree, no)
	    	{
				document.getElementById('infos').innerHTML = "uid : "+uid+"<br />Résultat : "+error+" : "+message+"<br />Durée : "+duree+"s";

				document.getElementById('u'+no).style.border = "#BF9A18 1px solid";
				document.getElementById('u'+no).style.background = "#CFAA20";
				if (nexttobeprevious != 0)
				{
					document.getElementById(nexttobeprevious).style.border = "#DFAA23 1px solid";
					document.getElementById(nexttobeprevious).style.background = "#EFCC53";
				}
				nexttobeprevious = 'u'+no;
	    	}

	    	function messageAdd(message)
	    	{
	    		var base ="";
	    		base = document.getElementById('messages').innerHTML;
				document.getElementById('messages').innerHTML = message+base;
	    	}
    	</script>
	</head>
	<body style='font-family:Sans-serif'>
		<center>
			<h2>Synchronisation de personnel</h2>
		</center>
		Messages :
		<div style='width:100%;height:100px;border:black 1px solid;overflow:auto;' id='messages'></div>
		Informations :
		<div style='width:100%;height:100px;border:black 1px solid;overflow:auto;' id='infos'></div>
		<div id='inside'>
			<span id="u628" onclick='displayInfo("jdc", "68", "Already exists", "0.0004", "628", "Array", "1", "1", "1", "1")' style='float:left;-moz-box-sizing: border-box; -ms-box-sizing: border-box;  box-sizing: border-box; font-size:10px;color:black;width:10%;border:#EFAA23 solid 1px;height:16px;overflow:hidden;background-color:#EFCC53;display:inline-block;'>
				<img style='vertical-align:middle;' src='./twoone/beige/against.gif' onload="messageAdd('1 - jdac : Existe déjà<br />')" />
				<span style='overflow:hidden;vertical-align:middle;font-size:10px;color:black;padding-left:2px;'>jdac</span>
			</span>
			<span id="u629" onclick='displayInfo("knil", "68", "Already exists", "0.0005", "629", "Array", "1", "1", "1", "1")' style='float:left;-moz-box-sizing: border-box; -ms-box-sizing: border-box;  box-sizing: border-box; font-size:10px;color:black;width:10%;border:#EFAA23 solid 1px;height:16px;overflow:hidden;background-color:#EFCC53;display:inline-block;'>
				<img style='vertical-align:middle;' src='./twoone/beige/against.gif' onload="messageAdd('2 - knil : Existe déjà<br />')" />
				<span style='overflow:hidden;vertical-align:middle;font-size:10px;color:black;padding-left:2px;'>knil</span>
			</span>
			<span id="u630" onclick='displayInfo("testicle", "68", "Already exists", "0.0003", "630", "Array", "1", "1", "1", "")' style='float:left;-moz-box-sizing: border-box; -ms-box-sizing: border-box;  box-sizing: border-box; font-size:10px;color:black;width:10%;border:#EFAA23 solid 1px;height:16px;overflow:hidden;background-color:#EFCC53;display:inline-block;'>
				<img style='vertical-align:middle;' src='./twoone/beige/against.gif' onload="messageAdd('3 - testicle : Existe déjà<br />')" />
				<span style='overflow:hidden;vertical-align:middle;font-size:10px;color:black;padding-left:2px;'>testicle</span>
			</span>
			<span id="u631" onclick='displayInfo("ttropcon", "68", "Already exists", "0.0005", "631", "Array", "1", "1", "1", "1")' style='float:left;-moz-box-sizing: border-box; -ms-box-sizing: border-box;  box-sizing: border-box; font-size:10px;color:black;width:10%;border:#EFAA23 solid 1px;height:16px;overflow:hidden;background-color:#EFCC53;display:inline-block;'>
				<img style='vertical-align:middle;' src='./twoone/beige/against.gif' onload="messageAdd('4 - ttropcon : Existe déjà<br />')" />
				<span style='overflow:hidden;vertical-align:middle;font-size:10px;color:black;padding-left:2px;'>ttropcon</span>
			</span>
			<span id="u632" onclick='displayInfo("cvraimenttroplongetçadepasse", "68", "Already exists", "0.0003", "632", "Array", "1", "1", "1", "")' style='float:left;-moz-box-sizing: border-box; -ms-box-sizing: border-box;  box-sizing: border-box; font-size:10px;color:black;width:10%;border:#EFAA23 solid 1px;height:16px;overflow:hidden;background-color:#EFCC53;display:inline-block;'>
				<img style='vertical-align:middle;' src='./twoone/beige/against.gif' onload="messageAdd('5 - cvraimenttroplongetçadepasse : Existe déjà<br />')" />
				<span style='overflow:hidden;vertical-align:middle;font-size:10px;color:black;padding-left:2px;'>cvraimenttroplongetçadepasse</span>
			</span>
		</div>
	</body>
</html>
avatar

35

liquid (./33) :
(tu pouvais pas faire une ligne de code plus longue ? biggrin.gif )

guitar


je regarde pour l'html

36

C'est quoi le problème au juste. Moi ça affiche ça :
zcy8
Les boutons en bas n'apparaissent que partiellement, ça me semble conforme à ce qu'on attend du overflow:hidden confus (FF 3.5.7)
J'ai quelque chose de similaire avec IE8

37

Non, le problème vient du dernier span...
Sous FF, j'ai comme toi, alors que sous IE, j'ai - argl non, j'ai rien dit, j'ai pas ce que je veux quoi qu'il arrive, après vérification :/
En fait, j'aimerais que dans la dernière case orange, j'ai "cvraimenttroplongetçadepasse" qui s'affiche, mais coupé par la bordure droite du span, pas rendu totalement invisible.
avatar

38

ah oui j'avais pas vu le dernier triso
bon, je regarde tout à l'heure (il faut que je fasse semblant de bosser un peu sad)

39

merde le mot est viré parce qu'il rentre pas trifus

40

Truc con : il ne serait pas passé à la ligne en-dessous, tout simplement ?
avatar
<<< Kernel Extremis©®™ >>> et Inventeur de la différence administratif/judiciaire ! (©Yoshi Noir)

<Vertyos> un poil plus mais elle suce bien quand même la mienne ^^
<Sabrina`> tinkiete flan c juste qu'ils sont jaloux que je te trouve aussi appétissant

41

tromb Fichier joint : JDgz (Capture d’écran 2010-01-27 à 12.08.21.png)
avatar
<<< Kernel Extremis©®™ >>> et Inventeur de la différence administratif/judiciaire ! (©Yoshi Noir)

<Vertyos> un poil plus mais elle suce bien quand même la mienne ^^
<Sabrina`> tinkiete flan c juste qu'ils sont jaloux que je te trouve aussi appétissant

42

ouais bah c'est pas ce que je veux embarrassed
avatar

43

À mon avis, tu vas devoir utiliser deux div l'un (B) dans l'autre (A).

A sera de largeur et hauteur fixes (100 x 20 px, mettons), et B de plus grande largeur (mettons 500px). Ça devrait marcher, avec le overflow:hidden sur A.
avatar
<<< Kernel Extremis©®™ >>> et Inventeur de la différence administratif/judiciaire ! (©Yoshi Noir)

<Vertyos> un poil plus mais elle suce bien quand même la mienne ^^
<Sabrina`> tinkiete flan c juste qu'ils sont jaloux que je te trouve aussi appétissant

44

45

Y'aurai pas moyen d'utiliser word-break et word-wrap à tout hasard ?
-word;
genre word-break: break-all;
word-wrap: break

J'ai pas firefox pour tester mais je pense que ça devrait marcher, au moins sur les dernières versions...
avatar
Le scénario de notre univers a été rédigée par un bataillon de singes savants. Tout s'explique enfin.
T'as un problème ? Tu veux un bonbon ?
[CrystalMPQ] C# MPQ Library/Tools - [CrystalBoy] C# GB Emulator - [Monoxide] C# OSX library - M68k Opcodes

46

Avec FF 3.5.7, ça ne marche pas (il ne connaît pas ces attributs).
J'avais pensé à la solution de Flanker, mais je trouve ça un peu cracra (bon, en même temps, je fais du dev Web, je dois m'y habituer cheeky).
avatar

47

Flanker (./43) :
À mon avis, tu vas devoir utiliser deux div l'un (B) dans l'autre (A).
A sera de largeur et hauteur fixes (100 x 20 px, mettons), et B de plus grande largeur (mettons 500px). Ça devrait marcher, avec le overflow:hidden sur A.

Bon bah ça ne marche pas (logique : l'overflow étant hidden sur A, comme B dépasse, il le cache).
avatar

48

un truc hyper important, si tu veux avoir les memes résultats sous IE et FF, met un doctype qui va bien. là apparement tu fais du html classique, donc utilises ce doctype pour forcer IE à agir normalement :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


Ancien pseudo : lolo

49

qu'est ce qui se passe si c'est en strict ?
avatar
納 豆パワー!
I becamed a natto!!!1!one!

50

ben pour l'HTML4, le doctype que j'ai donné est le seul qui oblige IE à se comporter vraiment comme il le devrait pt de vu du modèle de boites. donc si tu l'as mis en strict, ca doit vouloir dire que tu as surement du faire certains petits hacks sur les margins et autres trucs du meme style pour avoir exactement le meme rendu etre IE et FF.

après, si tu fait du xhtml, normalement IE fait les choses biens quelque soit le doctype
Ancien pseudo : lolo

51

arg, tu viens de m'eclairer sur pourquoi je galere depuis le debut de mon dev de site a rendre les pages bien affichees avec IE6 tripaf

(j'utilise pas xhtml : <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">)
avatar
納 豆パワー!
I becamed a natto!!!1!one!

52

Spipu (./50) :
ben pour l'HTML4, le doctype que j'ai donné est le seul qui oblige IE à se comporter vraiment comme il le devrait pt de vu du modèle de boites. donc si tu l'as mis en strict, ca doit vouloir dire que tu as surement du faire certains petits hacks sur les margins et autres trucs du meme style pour avoir exactement le meme rendu etre IE et FF.


Nonon, je n'ai fait aucun hack avec les margins, j'utilise uniquement des propriétés CSS3 (et je ne teste qu'avec IE8, en dessous, rien à battre vu que c'est destiné à un usage interne)
avatar

53

c'est a moi qu'il parlait grin
avatar
納 豆パワー!
I becamed a natto!!!1!one!

54

en fait je parlais à tous ceux que ca intéresse smile
Ancien pseudo : lolo

55

Ah ok grin
avatar

56

edit: j'ai raté des pages
avatar
Proud to be CAKE©®™


GCC4TI importe qui a problème en Autriche, pour l'UE plus et une encore de correspours nucléaire, ce n'est pas ytre d'instérier. L'état très même contraire, toujours reconstruire un pouvoir une choyer d'aucrée de compris le plus mite de genre, ce n'est pas moins)
Stalin est l'élection de la langie.

57

(oh, une grand maximum embarrassed)

58

59

---
avatar
Mes news pour calculatrices TI: Ti-Gen
Mes projets PC pour calculatrices TI: TIGCC, CalcForge (CalcForgeLP, Emu-TIGCC)
Mes chans IRC: #tigcc et #inspired sur irc.freequest.net (UTF-8)

Liberté, Égalité, Fraternité